
input[type="search"]::-webkit-search-cancel-button, input[type="search"]::-webkit-search-decoration, input[type="text"] {
    -webkit-appearance: none;
}
button, input, textarea, select {
    border: none;
    border-radius: 0;
    outline: none;

}

a,select,textarea,input,button,html,body,div,ul,li{
	-webkit-tap-highlight-color:transparent !important;
}
$color:#c8a063;
.fff{
	background: #fff;
}
.fafafa{
	background: #fafafa;
}
@font-face{
  font-family: 'DIN-BLACKALTERNATE';
  src: url('../fonts/DIN-BLACKALTERNATE.eot');
  src: url('../fonts/DIN-BLACKALTERNATE.eot?#iefix') format('embedded-opentype'),
       url('../fonts/DIN-BLACKALTERNATE.woff') format('woff'),
       url('../fonts/DIN-BLACKALTERNATE.ttf') format('truetype'),
       url('../fonts/DIN-BLACKALTERNATE.svg#Sri-TSCRegular') format('svg');
  font-weight: normal;
  font-style: normal;
}


@font-face {
  font-family: "AVGR65W";
  src: url("../fonts/AVGR65W.woff2") format("woff2"),
       url("../fonts/AVGR65W.woff") format("woff"),
       url("../fonts/AVGR65W.ttf") format("truetype"),
       url("../fonts/AVGR65W.eot") format("embedded-opentype"),
       url("../fonts/AVGR65W.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: "Roboto";
  src: url("../fonts/Roboto-Regular.woff2") format("woff2"),
       url("../fonts/Roboto-Regular.woff") format("woff"),
       url("../fonts/Roboto-Regular.ttf") format("truetype"),
       url("../fonts/Roboto-Regular.eot") format("embedded-opentype"),
       url("../fonts/Roboto-Regular.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

body{
	position:relative;
}

@font-face {
  font-family: "AVANTGARDEITCBYBT-DEMI";
  src: url("../fonts/AVANTGARDEITCBYBT-DEMI.woff2") format("woff2"),
       url("../fonts/AVANTGARDEITCBYBT-DEMI.woff") format("woff"),
       url("../fonts/AVANTGARDEITCBYBT-DEMI.ttf") format("truetype"),
       url("../fonts/AVANTGARDEITCBYBT-DEMI.eot") format("embedded-opentype"),
       url("../fonts/AVANTGARDEITCBYBT-DEMI.svg") format("svg");
  font-weight: normal;
  font-style: normal;
}

@mixin opacity($opacity){
	opacity:$opacity;
	filter:alpha(opacity=$opacity*100);
}

@mixin fz($fz,$lh){
	font-size:$fz;
	line-height:$lh;
}

.ellipsis{
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
}
body{
	background: #fafafa;
}

.w1680{
	width: 1680px;
	// width: 88.282%;
	margin:0 auto;
	@media(max-width: 1700px){
		width: 88.282%;
	}
	@media(max-width: 1024px){
		width: 100%;
	}
}
.w1680:after{
	clear: both;
	display: block;
	content:'';
}
.w1200{
	width: 1200px;
	margin:0 auto;
	@media(max-width: 1220px){
		width: 90%;
	}
	@media(max-width: 1024px){
		width: 100%;
	}
}

.w1440{
	width:1440px;
	margin-left:auto;
	margin-right:auto;
	@media(max-width:1460px){
		width:90%;
	}
}
.title{
	text-align: center;
	.cn{
		@include fz(36px,48px);
		color:#fff;
		@media(max-width:1460px){
			@include fz(30px,40px);
		}
		@media(max-width:1024px){
			@include fz(26px,36px);
		}
		@media(max-width:750px){
			@include fz(24px,36px);
		}
	}
	.en{
		@include fz(16px,24px);
		color:#fff;
		font-family: "Roboto";
		text-transform:uppercase;
		@media(max-width:1024px){
			@include fz(15px,22px);
		}
		@media(max-width:750px){
			@include fz(12px,20px);
		}
	}
	
}

header{
	width:100%;
	position: fixed;
	left:0;
	top:0;
	z-index:1000;
	display:block;
	height: 100px;
	background: #fafafa;
	// box-shadow: 0px 0px 6px 0px rgba( 1, 1, 1,0.31);
	transition:transform 0.5s ease-out;
	@media(max-width: 1024px){
		height:0.9rem;
		position: fixed;
	}
	&.slide{
		transform:translateY(-100%);
	}
	.bocweb-logo{
		width:250px;
		height: 37px;
		float: left;
		transition: all 0.5s;
		margin: 31px 0 0 1.875%;
		position: relative;
		z-index: 2;
		@media(max-width: 1250px){
			width:190px;
			height: 28px;
			margin: 36px 0 0 1.875%;
		}
		@media(max-width:1024px){
			width:2.5rem;
			height: 0.37rem;
			float: left;
			margin: 0.265rem 0 0 0.24rem;
		}
		img{
			max-width: 100%;
			display: block;
			margin:0 auto;
		}
	}
	.bocweb-menu{
		width: 0.41rem;
		height: 0.31rem;
		float: right;
		background: url(../img/bocweb-menu.png) no-repeat;
		background-size: cover;
		margin-top: 0.28rem;
		margin-right: 0.24rem;
		display: none;
		@media(max-width: 1024px){
			display: block;
		}
	}
	.bocweb-menu.on{
		background: url(../img/menu_close.png) no-repeat;
		background-size: cover;
	}
	.personal{
		position: relative;
		z-index: 2;
		float: right;
		width: 47px;
		height: 47px;
		// overflow: hidden;
		margin:26px 1.8% 0 0;
		@media(max-width: 1500px){
			margin:26px 1.5% 0 0;
		}
		@media(max-width:1024px){
			width: 0.47rem;
			height: 0.47rem;
			margin:0.215rem 0.2rem 0 0;
		}
		.icon{
			cursor: pointer;
			img{
				width: 100%;
				display: block;
			}
		}
		.loginregister{
			position: absolute;
			left: 0;
			top: 47px;
			width: 47px;
			display: none;
			@media(max-width:1024px){
				display: none !important;
			}
			.line{
				width: 1px;
				height: 15px;
				background: #dac7a9;
				margin:0 auto;
			}
			.login{
				width: 14px;
				font-size: 14px;
				color: #666666;
				line-height: 20px;
				margin:10px auto 0;
				border-bottom:1px solid #d1d1d1;
				padding-bottom:4px;
				display: block;
				transition:all 0.5s;
			}
			.register{
				width: 14px;
				font-size: 14px;
				color: #666666;
				line-height: 20px;
				margin:10px auto 0;
				display: block;
				transition:all 0.5s;
			}
			@media(min-width:1024px){
				a:hover{
					color: #c0a986;
				}
			}
			
		}
	}
	.bocweb-nav{
		// float: right;
		width: 100%;
		// margin-top: 23px;
		position: absolute;
		left: 0;
		top: 0;
		@media(max-width: 1024px){
			display: none;
		}
		.w1680{
			width: 87.5%;
			position: absolute;
			left: 50%;
			top: 23px;
			margin-left: -43.75%;
			overflow: hidden;
			@media(max-width:1700px){
				margin-left: -44%;
				width: 88%;
			}
			@media(max-width: 1024px){
				top: 0.16rem;
				display: none;
			}
			nav{
				ul{
					overflow: hidden;
					text-align: right;
					font-size: 0;
					li{
						// float: left;
						display: inline-block;
						text-align: right;
						margin-left: 58px;
						@media(max-width: 1500px){
							margin-left: 30px;
						}
						@media(max-width: 1200px){
							margin: 0 9px;
						}
						@media(max-width: 1100px){
							margin: 0 8px;
						}
						@media(max-width: 1024px){
							display: block;
							text-align: center;
							margin-left: 0;
						}
						a{
							font-size: 14px;
							color: #666666;
							line-height: 56px;
							display: block;
							height: 56px;
							box-sizing:border-box;
							transition:all 0.3s;
							@media(max-width: 1024px){
								height: 0.58rem;
								line-height: 0.58rem;
							}
						}
						@media(min-width:1024px){
							a:hover{
								font-weight: bold;
								color: #009e96;
								border-bottom:1px solid #009e96;
							}
						}
					}
					li.active{
						a{
							font-weight: bold;
							color: #009e96;
							border-bottom:1px solid #009e96;
						}
					}
				}
			}
		}
	}
	.bocweb_m_nav{
		width:100%;
		background: #fff;
		position:absolute;
		left:0;
		top:0.89rem;
		display: none;
		@media(min-width:1024px){
			display: none !important;
		}
		nav{

			.scroll{
				width: 100%;
				ul{
					
					>li{
						
						border-bottom:1px solid #f2f2f2;
						>a{
							display: block;
							font-size:0.28rem;
							color:#333;
							line-height: 0.72rem;
							padding:0 0.57rem 0 0.3rem;
							overflow: hidden;
							text-transform: uppercase;
							text-align: center;
							// span{
							// 	float: left;
							// 	display: block;
							// }
							// em{
							// 	width: 0.21rem;
							// 	height: 0.1rem;
							// 	float: right;
							// 	display: block;
							// 	background: url(../img/nav_icon1.png) no-repeat center center;
							// 	background-size: cover;
							// 	margin:0.32rem 0 0 0;
							// 	transition: all 0.3s;
							// 	transform-origin: center center;
							// }
						}
						
						dl{
							background: #f8f8f8;
							display: none;
							dd{
								>a{
									padding:0 0.57rem 0 0.6rem;
									font-size:0.24rem;
									color:#333333;
									line-height: 0.64rem;
									display: block;
									border-bottom:1px solid #f2f2f2;
									text-transform: uppercase;
								}
							}
							dd:last-child{
								a{
									border-bottom:0 none;
								}
								
							}
						}
					}
					>li.on{
						a{
							em{
								transform: rotate(-180deg);
							}
						}
						
					}
				}
			}
		}
	}
	.w1200{
		overflow: hidden;
		.padding{
			@media(max-width: 1024px){
				padding:0 0.2rem;
			}
		}
		.bocweb-logo{
			width:196px;
			height: 59px;
			float: left;
			transition: all 0.5s;
			margin-top: 25px;
			@media(max-width:1024px){
				width:1.96rem;
				height: 0.59rem;
				float: left;
				margin-top: 0.15rem;
			}
			.img{
				img{
					max-width: 100%;
					display: block;
					margin:0 auto;
				}
			}
		}
		.bocweb-menu{
			width: 0.41rem;
			height: 0.31rem;
			float: right;
			background: url(../img/bocweb-menu.png) no-repeat;
			background-size: cover;
			margin-top: 0.28rem;
			display: none;
			@media(max-width: 1024px){
				display: block;
			}
		}
		.bocweb-menu.on{
			background: url(../img/menu_close.png) no-repeat;
			background-size: cover;
		}
		.bocweb-search{
			width: 35px;
			height: 35px;
			background: url(../img/bocweb-search.png) no-repeat center center;
			background-size: contain;
			float: right;
			margin-top: 37px;
			cursor: pointer;
			@media(max-width: 1024px){
				margin-top: 0.245rem;
				width: 0.4rem;
				height: 0.4rem;
				margin-right: 10px;

			}
		}
		.bocweb_m_nav{
			width:100%;
			background: #fff;
			position:absolute;
			left:0;
			top:0.89rem;
			display: none;
			@media(min-width:1024px){
				display: none !important;
			}
			nav{

				.scroll{
					width: 100%;
					// overflow-y: scroll;
				
					ul{
						
						>li{
							
							border-bottom:1px solid #f2f2f2;
							>a{
								display: block;
								font-size:0.28rem;
								color:#333;
								line-height: 0.72rem;
								padding:0 0.57rem 0 0.3rem;
								overflow: hidden;
								text-transform: uppercase;
								span{
									float: left;
									display: block;
								}
								em{
									width: 0.21rem;
									height: 0.1rem;
									float: right;
									display: block;
									background: url(../img/nav_icon1.png) no-repeat center center;
									background-size: cover;
									margin:0.32rem 0 0 0;
									transition: all 0.3s;
									transform-origin: center center;
								}
							}
							
							dl{
								background: #f8f8f8;
								display: none;
								dd{
									>a{
										padding:0 0.57rem 0 0.6rem;
										font-size:0.24rem;
										color:#333333;
										line-height: 0.64rem;
										display: block;
										border-bottom:1px solid #f2f2f2;
										text-transform: uppercase;
									}
								}
								dd:last-child{
									a{
										border-bottom:0 none;
									}
									
								}
							}
						}
						>li.on{
							a{
								em{
									transform: rotate(-180deg);
								}
							}
							
						}
					}
				}
			}
		}
		.line{
			float: right;
			width: 1px;
			height: 33px;
			background: #d3d3d3;
			margin-right: 3%;
			margin-top: 38px;
			@media(max-width: 1024px){
				display: none;
			}
		}
	}
	.w1028:after{
		clear: both;
		display: block;
		content:'';
	}
}
header:after{
	display: block;
	content:'';
	clear: both;
}
header.removeFixed{
	top:-109px;
}
.sidebar{
	position: fixed;
	// right: 31px;
	right: 1.61%;
	top: 50%;
	width: 55px;
	z-index: 990;
	@media(max-width: 1500px){
		right: 1%;
	}
	@media(max-width: 1300px){
		right: 0.5%;
	}
	@media(max-width: 1024px){
		display: none;
	}
	ul{
		li{
			width: 55px;
			height: 55px;
			background: #fff;
			border-bottom:1px solid #e2e2e2;
			cursor: pointer;
			transition:all 0.5s;
			a{
				display: block;
				overflow: hidden;
				width: 55px;
				height: 55px;
				.icon{
					width: 22px;
					height: 20px;
					overflow: hidden;
					margin:17px auto 0;
					transition:all 0.5s;
				}
			}
		}
		.li1{
			a{
				.icon{
					background: url(../img/sidebar_icon1.png) no-repeat;
					background-size: cover;
				}
			}
		}
		.li2{
			a{
				.icon{
					background: url(../img/sidebar_icon2.png) no-repeat;
					background-size: cover;
				}
			}
		}
		.li3{
			a{
				.icon{
					background: url(../img/sidebar_icon3.png) no-repeat;
					background-size: cover;
				}
			}
		}
		.li4{
			a{
				.icon{
					background: url(../img/sidebar_icon4.png) no-repeat;
					background-size: cover;
				}
			}
		}
		@media(min-width:1024px){
			.li1:hover{
				background: #c0a986;
				a{
					.icon{
						background: url(../img/sidebar_icon1_h.png) no-repeat;
						background-size: cover;
					}
				}
			}
			.li2:hover{
				background: #c0a986;
				a{
					.icon{
						background: url(../img/sidebar_icon2_h.png) no-repeat;
						background-size: cover;
					}
				}
			}
			.li3:hover{
				background: #c0a986;
				a{
					.icon{
						background: url(../img/sidebar_icon3_h.png) no-repeat;
						background-size: cover;
					}
				}
			}
			.li4:hover{
				background: #c0a986;
				a{
					.icon{
						background: url(../img/sidebar_icon4_h.png) no-repeat;
						background-size: cover;
					}
				}
			}
		}
	}
}

.navigation_bg{
	position:fixed;
	width: 187px;
	height: 100%;
	left:250px;
	top:0;
	z-index:8;
	background: #b10100;
	opacity:0;
	visibility: hidden;
	transition: all 0.5s;
	transform: translateX(-10px);
	@media(max-width:1024px){
		display: none;
	}
}
.navigation_bg.active{
	transform: translateX(0);
	opacity: 1;
	visibility: visible;
}
.nav_slider{
	width:68px;
	height:auto;
	position:fixed;
	top:50%;
	right:0;
	z-index:10;
	margin-top:-160px;
	transition:all 0.5s;
	// display:none;
	@media(max-width:1400px){
		transform: translateX(70px);
		opacity: 0;
	}
	@media(max-width:1024px){
		transform: translateX(70px);
		display: none;
	}
	.qq{
		display: block;
		width:100%;
		height:60px;
		margin-top:1px; 
		background:#de0512;
		.ico{
			width:100%;
			height:32px;
			background:url(../img/nav_slider_qq.png) no-repeat bottom center;
		}
		.txt{
			font-size:12px;
			color:#fff;
			text-align: center;
			line-height:24px;  
		}
	}
	.tel{
		margin-top:1px; 
		background:#de0512;
		width:200px;
		position:relative;
		left:0;
		cursor:pointer;
		overflow:hidden;
		transition:all 0.5s;
		.t1{
			float:left;
			width:68px;
			height:60px;
			.ico{
				width:100%;
				height:32px;
				background:url(../img/nav_slider_tel.png) no-repeat bottom center;
			}
			.txt{
				font-size:12px;
				color:#fff;
				text-align: center;
				line-height:24px;  
			}
		}
		.t2{
			float:left;
			font-size:14px;
			color:#fff;
			line-height:60px;
			width:132px;  
		}
		&:hover{
			left:-132px;
		}
	}
	.ms{
		display: block;
		width:100%;
		margin-top:1px; 
		height:60px;
		background:#de0512;
		.ico{
			width:100%;
			height:32px;
			background:url(../img/nav_slider_email.png) no-repeat bottom center;
		}
		.txt{
			font-size:12px;
			color:#fff;
			text-align: center;
			line-height:24px;  
		}
	}
	.wx{
		display: block;
		width:100%;
		margin-top:1px; 
		height:60px;
		background:#de0512;
		position:relative;
		.code{
			width:120px;
			height:120px;
			position:absolute;
			left:-120px;
			top:0;
			overflow:hidden;
			display: none;
			background: #fff;
			img{
				width:100%;
				height:auto;
			}
		}
		.ico{
			width:100%;
			height:32px;
			background:url(../img/nav_slider_wx2.png) no-repeat bottom center;
		}
		.txt{
			font-size:12px;
			color:#fff;
			text-align: center;
			line-height:24px;  
		}
		&:hover{
			.code{
				display: block;
			}
		}
	}
	.top{
		display: block;
		width:100%;
		margin-top:1px; 
		height:60px;
		background:#de0512;
		.ico{
			width:100%;
			height:32px;
			background:url(../img/nav_slider_top.png) no-repeat bottom center;
		}
		.txt{
			font-size:12px;
			color:#fff;
			text-align: center;
			line-height:24px;  
		}
	}
}

.search_mark{
	width:100%;
	height:100%;
	position:fixed;
	left:0;
	top:0;
	z-index:10002;
	display:none;
	.bg{
		width:100%;
		height:100%;
		background: #000;
		position: absolute;
		left: 0;
		top:0;
		z-index: 1;
		opacity: 0.8;
		filter:alpha(opacity=80);
	}
	.close{
		width: 41px;
		height: 31px;
		position:absolute;
		right: 40px;
		top:40px;
		background: url(../img/menu_close_search.png) no-repeat;
		background-size: cover;
		cursor: pointer;
		z-index: 10;
		@media(max-width:1024px){
			width: 0.41rem;
			height: 0.31rem;
			right: 0.4rem;
			top:0.4rem;
		}
	}
	.mark_con{
		z-index: 10;
		width: 400px;
		height: 68px;
		border:1px solid #7d7d7d;
		border-radius:68px;
		position:relative;
		padding:0 58px 0 28px;
		position:absolute;
		left:50%;
		top:50%;
		margin:-34px 0 0 -200px;
		@media(max-width:1024px){
			width: 80%;
			height: 0.7rem;
			border-radius:0.7rem;
			padding:0;
			margin:-0.34rem 0 0 -40%;
		}
		form{
			@media(max-width:1024px){
				padding:0 0.58rem 0 0.28rem;
			}
			.cen{
				width: 100%;
				input{
					width: 100%;
					padding:15px 0;
					line-height: 38px;
					font-size:18px;
					color:#fff;
					border:0 none;
					background: none;
					@media(max-width:1024px){
						padding:0.15rem 0;
						line-height: 0.4rem;
						font-size:0.22rem;
					}
				}
			}
			.right{
				width: 29px;
				height: 29px;
				position:absolute;
				right: 20px;
				top:20px;
				@media(max-width:1024px){
					width: 0.29rem;
					height: 0.29rem;
					right: 0.2rem;
					top:0.2rem;
				}
				button{
					width: 29px;
					height: 29px;
					padding:0;
					border:0 none;
					outline: none;
					background: url(../img/search_icon.png) no-repeat;
					background-size: cover;
					@media(max-width:1024px){
						width: 0.29rem;
						height: 0.29rem;
					}
				}
			}
		}
	}
}

footer{
	position: relative;
	overflow: hidden;
	background: #333333;
	padding-top:60px;
	@media(max-width: 1024px){
		padding:20px 0.24rem 0;
	}
	.footer_top{
		padding-bottom:103px;
		border-bottom:1px solid #3a3a3a;
		@media(max-width: 1024px){
			padding-bottom:20px;
		}
		.w1680{

			.left{
				// width: 1353px;
				width: 79.353%;
				float: left;
				overflow: hidden;
				@media(max-width: 1450px){
					width: 76.353%;
				}
				@media(max-width: 1024px){
					display: none;
				}
				// @media(max-width: 1150px){
				// 	width: 79.353%;
				// }
				dl{
					// margin-right: 70px;
					margin-right: 5.87%;
					float: left;
					@media(max-width: 1700px){
						margin-right: 4.8%;
					}
					@media(max-width: 1600px){
						margin-right: 4%;
					}
					@media(max-width: 1280px){
						margin-right: 2%;
					}
					@media(max-width: 1100px){
						margin-right: 1.6%;
					}
					dt{
						font-size: 16px;
						color: #999999;
						line-height: 40px;
						position: relative;
						margin-bottom: 16px;
						@media(max-width: 1450px){
							font-size: 14px;
							line-height: 38px;
						}
						.line{
							width: 30px;
							height: 1px;
							background: #4f4f4f;
							position: absolute;
							left: 0;
							bottom: -1px;
						}
					}
					dd{
						a{
							font-size: 14px;
							color: #999;
							line-height: 26px;
							transition:all 0.5s;
							@media(max-width: 1450px){
								font-size: 12px;
								line-height: 24px;
							}
						}
						@media(min-width:1024px){
							a:hover{
								color: #fff;
							}
						}
					}
				}
				dl:last-child{
					margin-right: 0;
				}
			}
			.m_nav{
				display: none;
				@media(max-width: 1024px){
					display: block;
				}
				ul{
					li{
						border-bottom:1px solid #4d4d4d;
						.li_tit{
							line-height: 40px;
							font-size: 16px;
							color: #999999;
							overflow: hidden;
							span{
								float: left;
							}
							.icon{
								width: 17px;
								height: 17px;
								background: url(../img/footer_icon1.png) no-repeat;
								float: right;
								background-size: cover;
								margin-top: 11px;
							}
						}
						dl{
							border-top:1px solid #4d4d4d;
							display: none;
							dd{
								a{
									font-size: 14px;
									color: #999;
									line-height: 26px;
									transition:all 0.5s;
									@media(max-width: 1450px){
										font-size: 12px;
										line-height: 24px;
									}
								}
								@media(min-width:1024px){
									a:hover{
										color: #fff;
									}
								}
							}
						}
					}
					li.active{
						.li_tit{
							.icon{
								background: url(../img/footer_icon2.png) no-repeat;
								background-size: cover;
							}
						}
					}
				}
			}
			.line{
				width: 1px;
				height: 185px;
				background: #414141;
				float: left;
				margin-top: 21px;
				@media(max-width: 1024px){
					display: none;
				}
			}
			.right{
				// width: 328px;
				width: 19.52%;
				margin-top: 12px;
				float: right;
				@media(max-width: 1024px){
					width: 100%;
					margin-top: 12px;
					float: inherit;
				}
				.logo{
					// float: right;
					display: block;
					width: 100%;
					height: 35px;
					overflow: hidden;
					img{
						max-width: 100%;
						display: block;
						float: right;
						@media(max-width: 1024px){
							float: inherit;
							margin:0 auto;
						}
					}
				}
				.text{
					font-size: 0;
					text-align: right;
					line-height: 26px;
					margin-top: 34px;
					@media(max-width: 1024px){
						text-align: center;
						margin-top: 20px;
					}
					.icon{
						display: inline-block;
						text-align: right;
						width: 25px;
						height: 25px;
						overflow: hidden;
						margin:0 4px;
						vertical-align: middle;
						background: url(../img/tel_icon.png) no-repeat center center;
						@media(max-width: 1024px){
							vertical-align: middle;
							text-align: center;
						}
					}
					span{
						font-size: 18px;
						color: #adadad;
						display: inline-block;
						text-align: right;
						margin:0 4px;
						vertical-align: middle;
						@media(max-width: 1024px){
							font-size: 16px;
							vertical-align: middle;
							text-align: center;
						}
					}
					.m_tel{
						display: none;
						@media(max-width: 1024px){
							display: inline-block;
						}
						text-align: center;
						font-size: 20px;
						color: #adadad;
						margin:0 4px;
						font-family: 'Arial';
						vertical-align: middle;
					}
				}
				.tel{
					font-size: 28px;
					color: #adadad;
					font-family: 'Arial';
					line-height: 42px;
					text-align: right;
					@media(max-width: 1024px){
						text-align: left;
						display: none;
					}
				}
				.share{
					overflow: hidden;
					margin-top: 21px;
					@media(max-width: 1024px){
						margin-top: 10px;
					}
					.bdsharebuttonbox{
						text-align: right;
						// display: inline-block;
						font-size: 0;
						@media(max-width: 1024px){
							text-align: center;
						}
						a{
							display: inline-block;
							text-align: right;
							padding:0;
							margin:0;
							float: inherit;
							width: 30px;
							height: 30px;
							margin-left: 12px;
							opacity: 1;
							transition:all 0.5s;
							@media(max-width: 1024px){
								text-align: center;
							}
						}
						a.bds_tsina{
							background: url(../img/sina.png) no-repeat center center;
							background-size: cover;
						}
						a.bds_weixin{
							background: url(../img/wechat.png) no-repeat center center;
							background-size: cover;
						}
						a.bds_qzone{
							background: url(../img/qq.png) no-repeat center center;
							background-size: cover;
						}
						@media(min-width:1024px){
							a.bds_tsina:hover{
								background: url(../img/sina_h.png) no-repeat center center;
								background-size: cover;
							}
							a.bds_weixin:hover{
								background: url(../img/wechat_h.png) no-repeat center center;
								background-size: cover;
							}
							a.bds_qzone:hover{
								background: url(../img/qq_h.png) no-repeat center center;
								background-size: cover;
							}
						}
					}
				}
			}
		}
	}
	.footer_bot{
		line-height: 70px;
		overflow: hidden;
		@media(max-width: 1300px){
			line-height: 0;
		}
		@media(max-width: 1024px){
			line-height: 24px;
			padding-bottom:10px;
		}
		.w1680{
			.left{
				font-size: 14px;
				color: #77797d;
				float: left;
				@media(max-width: 1300px){
					float: inherit;
					margin-top: 10px;
					line-height: 24px;
					text-align: center;
					padding-bottom:10px;
				}
				@media(max-width: 1024px){
					float: inherit;
					text-align: center;
				}
				p{
					display: inline;
					@media(max-width: 1024px){
						display: block;
					}
				}
				a{
					color: #77797d;
					transition:all 0.5s;
				}
				@media(min-width:1024px){
					a:hover{
						color: #fff;
					}
				}
			}
			.right{
				margin-top: 27px;
				float: right;
				@media(max-width: 1300px){
					float: inherit;
					margin-top: 20px;
				}
				@media(max-width: 1024px){
					float: inherit;
					margin-top: 20px;
				}
				ul{
					overflow: hidden;
					@media(max-width: 1300px){
						text-align: center;
						font-size: 0;
					}
					@media(max-width: 1024px){
						font-size: 0;
						text-align: center;
					}
					li{
						float: left;
						@media(max-width: 1300px){
							display: inline-block;
							text-align: center;
							float: inherit;
						}
						@media(max-width: 1024px){
							float: inherit;
							display: inline-block;
							text-align: center;
						}
						a{
							font-size: 14px;
							color: #77797d;
							border-right:1px solid #666666;
							line-height: 14px;
							display: block;
							padding:0 12px;
							transition:all 0.5s;
						}
						@media(min-width:1024px){
							a:hover{
								color: #fff;
							}
						}
					}
					li:last-child{
						a{
							padding:0 0 0 12px;
							border-right:0 none;
						}
					}
				}
			}
		}
	}
	
}
.video_mark{
	width:100%;
	height:100%;
	position:fixed;
	left:0;
	top:0;
	background: rgba(0,0,0,0.8);
	z-index:1100;
	.mark_con{
		width: 660px;
		height: 500px;
		position:absolute;
		left:50%;
		top:50%;
		margin:-250px 0 0 -330px;
		@media(max-width:800px){
			width: 80%;
			height: 4rem;
			margin:-2rem 0 0 -40%;
		}
		.close{
			width: 41px;
			height: 31px;
			position:absolute;
			right: -41px;
			top:0;
			background: url(../img/menu_close_search.png) no-repeat;
			background-size: cover;
			cursor: pointer;
			@media(max-width:800px){
				width: 0.41rem;
				height: 0.31rem;
				right: -0.41rem;
			}
		}
		.video_con{
			video{
				width: 100%;
				height: 100%;
			}
		}
	}
}
#window-screen-pop{
    position: fixed;
    top: 50%;
    left: 50%;
    z-index: 1000;
    background: rgb(255, 255, 255);
    box-shadow: rgba(0, 0, 0, 0.2) 0px 0px 10px;
    width: 530px;
    height: 280px;
    box-sizing: border-box;
    padding: 80px 20px 0px;
    font-size: 16px;
    line-height: 1.8;
    margin-left: -285px !important;
    margin-top: -140px !important;
    text-align: center;
}
.screen-pop-close{
	position: absolute;
	top: 4%;
	right: 4%;
	cursor: pointer;
	width: 22px;
	height: 22px;
	background: url(../img/close-btn.png) no-repeat center center;
}
.abanner{
	overflow: hidden;
	// animation: inherit !important;
	img{
		width:100%;
		height:auto;
		@media(min-width:1903px) and (max-width:1920px){
			width:1920px;
		}
		@media(max-width:1024px){
			width:130%;
			margin-left:-15%;
		}
		@media(max-width:500px){
			width: 170%;
    		margin-left: -22%;
		}
	}
}
.main{
	opacity:1;
	transition:opacity 0.2s;
	position: relative;
	overflow: hidden;
	padding-top:100px;
	@media(max-width: 1024px){
		padding-top:0.89rem;
	}
	.case_box{
		padding-top:95px;
		padding-bottom:120px;
		@media(max-width:1200px){
			padding-top:80px;
			padding-bottom:100px;
		}
		@media(max-width:1024px){
			padding:60px 0;
		}
		@media(max-width:600px){
			padding:30px 0;
		}
		.title{
			.cn{
				color:#333;
			}
			.en{
				color:#999;
			}
		}
		.case_list{
			margin-top:7px;
			ul{
				padding-bottom:75px;
				width:110%;
				@media(max-width:1200px){
					padding-bottom:50px;
				}
				@media(max-width:750px){
					width:100%;
					padding-bottom:30px;
				}
				@media(max-width:500px){
					margin-top:18px;
					padding-bottom:20px;
				}
				li{
					float:left;
					width:29%;
					background: #fff;
					margin-right: 1.9%;
					background-color: #fff;
					cursor:pointer;
					box-shadow: 0 5px 40px rgba(142,142,142,.1);
					margin-top:2.7%;
					@media(min-width:1024px){
						&:hover{
							a,.pt{
								background: #c8a063;
								.pic{
									img{
										transform:scale(1.05);
									}
									.mask{
										@include opacity(1);
									}
									.ico{
										transform:translate(0,0);
									}
								}
								.txt{
									color:#fff;
								}
							}
						}
					}
					@media(max-width:750px){
						width:48%;
						margin-right:0;
						margin-top:4%;
						&:nth-child(even){
							float:right;
						}
					}
					@media(max-width:500px){
						width:100%;
						margin-right:0;
						float:none;
						margin-top:15px;
						&:nth-child(even){
							float:none;
						}
					}
					a,.pt{
						display: block;
						padding:5px;
						transition:all 0.5s ease-in-out;
						padding-bottom:0;
						.pic{
							width:100%;
							overflow: hidden;
							position:relative;
							.mask{
								position:absolute;
								width:100%;
								height:100%;
								background:rgba(0,0,0,0.5);
								left:0;
								top:0;
								@include opacity(0);
								transition:all 0.5s ease;
								@media(max-width:1024px){
									@include opacity(1);
									trannsition:none;
								}
							}
							.ico{
								width:76px;
								height:76px;
								overflow: hidden;
								position:absolute;
								left:50%;
								margin-left:-38px;
								top:50%;
								margin-top:-38px;
								transition: all 0.5s cubic-bezier(0, 0.76, 0.85, 0.91);
							    z-index: 10;
							    transform: translateY(-250%);
							    @media(max-width:1024px){
							    	transform: translateY(0px);
							    	transition:none;
							    }
								img{
									width:100%;
									height: auto;
									transform:scale(1) !important;
								}
								@media(max-width:1200px){
									width: 60px;
   									height: 60px;
   									margin-left:-30px;
   									margin-top:-30px;
								}
								@media(max-width:600px){
									width: 40px;
   									height: 40px;
   									margin-left:-20px;
   									margin-top:-20px;
								}
							}
							a{
								overflow: hidden;
								display: none;
								padding:0;
								&.show{
									display: block;
								}
							}
							img{
								width:100%;
								height: auto;
								transition:all 0.5s ease-in-out;
							}
						}
						.txt{
							@include fz(16px,24px);
							color:#666;
							padding:18px 10px;
							text-align: center;
							@extend .ellipsis;
							transition:color 0.5s ease-in-out;
							box-sizing:border-box;
							@media(max-width:1024px){
								padding:15px 10px;
							}
							@media(max-width:500px){
								font-size:14px;
								padding:10px;
							}
						}
					}
				}
			}
		}
	}
	.program{
		.box{
			&.box2{
				.box_cen{
					.ds{
						@media(max-width:1024px){
							width:90%;
						}
					}
					.wrap{
						.pic{
							float:left;
							@media(max-width:1024px){
									padding-right:0;
									width:100%;
									float:none;
								}
						}
						.text_box{
							.text{
								float:right;
								width:41.4%;
								padding-right:6.4%;
								box-sizing:border-box;
								@media(max-width:1024px){
									padding-right:0;
									width:100%;
									float:none;
								}
							}
							.solutions{
								float:right;
								overflow: hidden;
								.tit_box{
									@media(max-width:600px){
										width:100%;
									}
								}
								.tbox{
									width:38.55%;
									@media(max-width:600px){
										width:50%;
									}
								}
							}
						}
					}
				}
			}
			&.fff .box_cen{
				.ds{
					@media(max-width:1024px){
						width:90%;
					}
				}
			}
			.box_cen{
				padding-top:98px;
				padding-bottom:98px;
				@media(max-width:1200px){
					padding:80px 0;
				}
				@media(max-width:1024px){
					padding:60px 0;
				}
				@media(max-width:600px){
					padding:30px 0;
				}
				.title{
					.cn{
						color:#333;
					}
					.en{
						color:#999;
					}
				}
				.ds{
					@include fz(16px,30px);
					color:#666;
					margin-top:20px;
					width:910px;
					margin-left:auto;
					margin-right:auto;
					text-align: center;
					@media(max-width:1024px){
						@include fz(14px,24px);
						width:100%;
						margin-top:15px;
					}
					@media(max-width:600px){
						margin-top:10px;
						@include fz(13px,20px);
					}
				}
				.list{
					padding-top:12px;
					ul{
						.li{
							background: #fff;
							margin-top:30px;
							@media(min-width:1024px){
								&:hover{
									.pic{
										img{
											transform:scale(1.05);
										}
									}
								}
							}
							&:nth-child(even){
								.pic{
									float:left;
									.name{
										right:auto;
										left:0;
									}
								}
								@media(max-width:1024px){
									.pic{
										float:none;
									}
									
								}
							}
							@media(max-width:600px){
								margin-top:15px;
							}
							.cont{
								float:left;
								width:40.3%;
								padding:0 4.1%;
								box-sizing:border-box;
								@media(max-width:1300px){
									padding:0 3%;
								}
								@media(max-width:1024px){
									width:100%;
									float:none;
									padding:20px 3%;
								}
								.cont_box{
									@media(max-width:1024px){
										height: auto !important;
									}
								}
								.t{
									@include fz(24px,38px);
									color:#000;
									padding-top: 10%;
									@media(max-width:1300px){
										@include fz(20px,34px);
									}
									@media(max-width:1024px){
										padding-top:0;
									}
									@media(max-width:600px){
										@include fz(18px,30px);
									}
								}
								.con{
									@include fz(16px,28px);
									color:#727171;
									margin-top:13px;
									@media(max-width:1300px){
										@include fz(15px,24px);
										margin-top:10px;
									}
								}
								.text{
									margin-top:14px;
									ul{
										li{
											margin-top:18px;
											padding-left:74px;
											position:relative;
											min-height:56px;
											@media(max-width:1300px){
												margin-top:10px;
											}
											@media(max-width:1100px){
												min-height:46px;
												padding-left:60px;
												margin-top:10px;
											}
											@media(max-width:600px){
												margin-top:6px;
												padding-left:50px;
											}
											.img{
												width:56px;
												height:56px;
												position:absolute;
												left:0;
												top:50%;
												margin-top:-28px;
												@media(max-width:1100px){
													height:46px;
													width:46px;
													margin-top:-23px;
												}
												@media(max-width:600px){
													width:40px;
													height:40px;
													margin-top:-20px;
												}
												img{
													width:100%;
													height: auto;
												}
											}
											.txt{
												min-height:56px;
												width:100%;
												@media(max-width:1100px){
													min-height:46px;
												}
												@media(max-width:600px){
													min-height:40px;
												}
												.tab{
													width:100%;
													height:100%;
													min-height:56px;
													display:table;
													.tab_cell{
														display: table-cell;
														vertical-align: middle;
														@include fz(14px,24px);
														color:#727171;
													}
												}
											}
										}
									}
								}
							}
							.pic{
								width:59.7%;
								float:right;
								overflow: hidden;
								position:relative;
								@media(max-width:1024px){
									width:100%;
									float:none;
								}
								img{
									width:100%;
									height: auto;
									transition:all 0.5s ease-in-out;
								}
								.name{
									min-width:310px;
									position:absolute;
									background: #000;
									padding:0 10px;
									right:0;
									bottom:0;
									box-sizing:border-box;
									z-index:10;
									text-align: center;
									font-size:0;
									@media(max-width:600px){
										min-width:200px;
										display: none;
									}
									span{
										@include fz(24px,60px);
										color:#fff;
										display: inline-block;
										vertical-align: middle;
										margin:0 10px;
										@media(max-width:1300px){
											@include fz(20px,50px);
										}
										@media(max-width:1024px){
											padding-top:0;
										}
										@media(max-width:600px){
											margin:0 3px;
											@include fz(18px,36px);
										}
									}
									.ico{
										margin:0 10px;
										width:26px;
										height:12px;
										background:url(../img/j.png) no-repeat;
										background-size: cover;
										display: inline-block;
										vertical-align: middle;
										@media(max-width:600px){
											margin:0 3px;
										}
									}
								}
							}
						}
					}
				}
				.wrap{
					position:relative;
					margin-top:40px;
					@media(max-width:600px){
						margin-top:20px;
					}
					.pic{
						width:53.1%;
						float:right;
						overflow: hidden;
						@media(max-width:1400px){
							width:58%;
						}
						img{
							width:100%;
							height: auto;
						}
						@media(max-width:1024px){
							width:100%;
							float:none;
						}
					}
					.text_box{
						position:absolute;
						width:1440px;
						left:50%;
						margin-left:-720px;
						top:0;
						@media(max-width:1460px){
							width:90%;
							margin-left:-45%;
						}
						@media(max-width:1024px){
							position:static;
							margin:0 auto;
							padding:20px 0;
						}
						@media(max-width:600px){
							padding-bottom:0;
						}
						.text{
							margin-top:4%;
							width:35%;
							@media(max-width:1520px){
								margin-top:2%;
							}
							@media(max-width:1024px){
								width:100%;
								margin-top:0;
							}
							ul{
								li{
									margin-top:18px;
									padding-left:74px;
									position:relative;
									min-height:56px;
									@media(max-width:1300px){
										margin-top:10px;
									}
									@media(max-width:1100px){
										min-height:46px;
										padding-left:60px;
										margin-top:10px;
									}
									@media(max-width:600px){
										margin-top:6px;
										min-height:40px;
										padding-left:50px;
									}
									.img{
										width:56px;
										height:56px;
										position:absolute;
										left:0;
										top:50%;
										margin-top:-28px;
										@media(max-width:1100px){
											height:46px;
											width:46px;
											margin-top:-23px;
										}
										@media(max-width:600px){
											width:40px;
											height:40px;
											margin-top:-20px;
										}
										img{
											width:100%;
											height: auto;
										}
									}
									.txt{
										min-height:56px;
										width:100%;
										@media(max-width:1100px){
											min-height:46px;
										}
										@media(max-width:600px){
											min-height:40px;
										}
										.tab{
											width:100%;
											height:100%;
											min-height:56px;
											display:table;
											.tab_cell{
												display: table-cell;
												vertical-align: middle;
												@include fz(14px,24px);
												color:#727171;
											}
										}
									}
								}
							}
						}
						.solutions{
							width:61.3%;
							background-color: #fff;
							height:160px;
							margin-top:5%;
							box-shadow: 0 5px 40px rgba(132,132,132,.15);
							@media(max-width:1700px){
								height:120px;
								margin-top:3%;
							}
							@media(max-width:1024px){
								width:100%;
							}
							@media(max-width:600px){
								height: auto;
								margin-top:15px;
							}
							.tbox{
								width:25.7%;
								float:left;
								height: 100%;
								float:left;
								padding:42px 14px 0 14px;
								text-align: center;
								border-right:1px solid #eee;
								box-sizing:border-box;	
								@media(max-width:1700px){
									padding:18px 14px 0 14px;
								}
								@media(max-width:1250px){
									padding:18px 8px 0 8px;
								}
								@media(max-width:600px){
									width:50%;
									border-top:1px solid #eee;
									height: 120px;
									margin-top:-1px;
								}
								.t{
									@include fz(20px,28px);
									color:#c8a063;
									font-weight:bold;
									font-style: italic;
									@media(max-width:1250px){
										@include fz(16px,28px);
									}
								}
								.con{
									@include fz(14px,22px);
									color:#666;
									margin-top:7px;
									@media(max-width:1250px){
										@include fz(13px,20px);
										margin-top:4px;
									}
								}
							}
							.tit_box{
								height: 100%;
								width:22.9%;
								padding:0 8px;
								box-sizing:border-box;
								float:left;
								text-align: center;
								border-right:1px solid #eee;
								@media(max-width:600px){
									margin-top:-1px;
									width:50%;
									border-top:1px solid #eee;
									height: 120px;
								}
								.tit{
									padding-top:42px;
									@media(max-width:1700px){
										padding-top:18px;
									}
									.cn{
										@include fz(20px,28px);
										color:#333;
										font-weight:bold;
										@media(max-width:1250px){
											@include fz(16px,28px);
										}
									}
									.en{
										@include fz(14px,20px);
										color:#ccc;
										font-family: "AVANTGARDEITCBYBT-DEMI";
										@media(max-width:1250px){
											@include fz(13px,20px);
										}
									}
								}
								.ico{
									margin-top:10px;
									text-align: center;
									@media(max-width:600px){
										margin-top:5px;
									}
								}
							}
						}
					}
				}
				.item_box{
					margin-top:40px;
					@media(max-width:1100px){
						margin-top:70px;
					}
					@media(max-width:1024px){
						margin-top:30px;
					}
					@media(max-width:600px){
						margin-top:20px;
					}
					.item_list{
						.owl-controls{
							position:static;
							margin-top:15px;
							.owl-dots{
								text-align: center;
								font-size:0;
								.owl-dot{
									margin:0 5px;
									width:10px;
									display: inline-block;
									height:10px;
									border-radius:50%;
									background: #9aa0a0;
									&.active{
										background:#c8a063;
									}
								}
							}
						}
						a{
							display: block;
							@media(min-width:1024px){
								&:hover{
									.tu img{
										transform:scale(1.05);
									}
								}
							}
							.tu{
								position:relative;
								overflow: hidden;

								img{
									width:100%;
									transition:all 0.5s ease-in-out;
									height: auto;
								}
								.txt{
									position:absolute;
									bottom:0;
									left:0;
									@include fz(14px,44px);
									color:#fff;
									padding:0 10px;
									box-sizing:border-box;
									text-align: center;
									width:100%;
									@extend .ellipsis;
									background:rgba(0,0,0,0.6);
									@media(max-width:600px){
										@include fz(14px,36px);
									}
								}
							}
						}
					}
					.more{
						display: block;
						width:200px;
						height:50px;
						background: #c8a063;
						border-radius:25px;
						text-align: center;
						font-size:0;
						margin-top:40px;
						margin-left:auto;
						margin-right:auto;
						@media(max-width:1024px){
							margin-top:30px;
						}
						@media(max-width:600px){
							margin-top:20px;
						}
						@media(min-width:1024px){
							&:hover{
								img{
									transform:translate(10px,0);
								}
							}
						}
						.txt{
							display: inline-block;
							@include fz(18px,50px);
							color:#fff;
							margin:0 7px;
							vertical-align: middle;
						}
						img{
							margin:0 7px;
							display: inline-block;
							transition:transform 0.5s;
							vertical-align: middle;
						}
						@media(max-width:1024px){
							width:160px;
							height:40px;
							border-radius:20px;
							.txt{
								@include fz(16px,40px);
							}
						}
						@media(max-width:600px){
							width:140px;
							height:40px;
							border-radius:20px;
							.txt{
								@include fz(14px,40px);
							}
						}
					}
				}
			}
		}
		.safety{
			padding-top:90px;
			padding-bottom:125px;
			@media(max-width:1200px){
				padding-top:80px;
				padding-bottom:100px;
			}
			@media(max-width:1024px){
				padding:60px 0;
			}
			@media(max-width:600px){
				padding:30px 0;
			}
			.safe_top{
				margin-top:60px;
				@media(max-width:1200px){
					margin-top:40px;
				}
				@media(max-width:600px){
					margin-top:20px;
				}
				.swiper-container{
					overflow: inherit;
					.swiper-wrapper{
						height: auto !important;
						.swiper-slide{
							height: auto !important;
							background: #c8a063;
							cursor:pointer;
							border-right:1px solid #d3b382;
							box-sizing:border-box;
							position:relative;
							padding:30px 10px 23px 10px;
							@media(max-width:1024px){
								padding:20px 10px 13px 10px;
							}
							@media(max-width:600px){
								padding:10px;
							}
							&.active{
								.bg{
									@include opacity(1);
									transform:scaleY(1.14);
									@media(max-width:600px){
										transform:scaleY(1);
									}
								}
								.icon{
									img{
										@include opacity(0);
										&.active{
											@include opacity(1);
										}
									}
								}
								.txt{
									color:#c8a063;
								}
							}
							@media(min-width:1024px){
								&:hover{
									.bg{
										@include opacity(1);
										transform:scaleY(1.14);

									}
									.icon{
										img{
											@include opacity(0);
											&.active{
												@include opacity(1);
											}
										}
									}
									.txt{
										color:#c8a063;
									}
								}
							}
							.bg{
								position:absolute;
								left:0;
								top:0;
								right:-1px;
								bottom:0;
								background:url(../img/22.png) no-repeat #fff;
								transform:scaleY(1);
								@include opacity(0);
								transition:transform 0.5s cubic-bezier(0, 0.76, 0.85, 0.91);
								box-shadow:20px 20px 21px 7px rgba(0, 0, 0, 0.5)
							}
							.icon{
								width:44px;
								height:44px;
								position:relative;
								margin:0 auto;
								z-index:10;
								@media(max-width:1024px){
									width:34px;
									height: 34px;
								}
								@media(max-width:600px){
									width:24px;
									height: 24px;
								}
								img{
									position:absolute;
									left:0;
									top:0;
									right:0;
									bottom:0;
									margin:auto;
									max-width:100%;
									transition:all 0.5s cubic-bezier(0, 0.76, 0.85, 0.91);
									max-height:100%;
									&.active{
										@include opacity(0);
									}
								}
							}
							.txt{
								text-align: center;
								@include fz(20px,36px);
								color:#fff;
								margin-top:8px;
								transition:color 0.5s cubic-bezier(0, 0.76, 0.85, 0.91);
								position:relative;
								z-index:10;
								@media(max-width:1400px){
									@include fz(18px,30px);
								}
								@media(max-width:1024px){
									@include fz(16px,24px);
									margin-top:5px;
								}
								@media(max-width:600px){
									@include fz(14px,24px);
								}
							}
						}
					}
				}
			}
			.safe_content{
				margin-top:40px;
				@media(max-width:600px){
					margin-top:20px;
				}
				.sbox{
					background: #fff;
					.cont_box{
						width:48.6%;
						padding:0 3.4%;
						box-sizing:border-box;
						float:left;
						@media(max-width:750px){
							width:100%;
							float:none;
						}
						.txt{
							@include fz(16px,20px);
							color:#666;
							padding-top:8%;
							@media(max-width:1200px){
								font-size:14px;
							}
							@media(max-width:750px){
								padding-top: 25px;
							}
						}
						.ti{
							@include fz(24px,36px);
							color:#333;
							margin-top:32px;
							.name{
								margin-right:25px;
								@include fz(60px,60px);
								color:#c8a063;
								font-family: "AVGR65W";
								display: inline-block;
								vertical-align: bottom;
							}
							@media(max-width:1400px){
								@include fz(20px,30px);
								margin-top:20px;
								.name{
									margin-right:15px;
									@include fz(50px,50px);
								}
							}
							@media(max-width:1200px){
								@include fz(16px,30px);
								margin-top:15px;
								.name{
									margin-right:15px;
									@include fz(40px,40px);
								}
							}
							@media(max-width:1024px){
								@include fz(14px,20px);
								margin-top:10px;
								.name{
									margin-right:5px;
									@include fz(30px,30px);
								}
							}
						}
						.txt_box{
							@include fz(14px,24px);
							color:#666;
							margin-top:27px;
							@media(max-width:1400px){
								margin-top: 20px;
							}
							@media(max-width:1200px){
								margin-top:12px;
							}
							@media(max-width:1200px){
								@include fz(13px,20px);
								margin-top:8px;
							}
							@media(max-width:750px){
								height: auto !important; 
							}

							p{
								margin-top:10px;
								padding-left:12px;
								background:url(../img/rr.png) no-repeat left 10px;

							}
						}
					}
					.pic_box{
						width:51.38%;
						float:right;
						padding:10px;
						box-sizing:border-box;
						@media(max-width:750px){
							width:100%;
							float:none;
							margin-top:10px;
						}
						.pic_list{
							.owl-controls{
								position:absolute;
								bottom:16px;
								width:100%;
								left:0;
								@media(max-width:600px){
									bottom:10px;
								}
								.owl-dots{
									text-align: center;
									font-size:0;
									.owl-dot{
										margin:0 8px;
										width:10px;
										display: inline-block;
										height:10px;
										border-radius:50%;
										background: #fff;
										border:1px solid #fff;
										&.active{
											background:none;
										}
									}
								}
							}
							.item{
								overflow: hidden;	
								img{
									width:100%;
									height: auto;
								}
							}
						}
					}
				}
			}
		}
		.product_box{
			.product_top{
				padding-top:63px;
				position:relative;
				padding-bottom:114px;
				@media(max-width:1200px){
					padding-top:45px;
					padding-bottom:80px;
				}
				@media(max-width:850px){
					padding-top:30px;
					padding-bottom:50px;
				}
				@media(max-width:500px){
					padding-bottom:30px;
				}
				.pro{
					.border{
						position:absolute;
						width:1046px;
						left:50%;
						height:100%;
						margin-left:-523px;
						background:url(../img/br.png) no-repeat center center;
						background-size: cover;
						top:0;
						@media(max-width:1460px){
							width:70%;
							margin-left:-35%;
						}
						@media(max-width:800px){
							display: none;
						}
					}

					.wrap{
						position:relative;
						.prev{
							width:50px;
							height:50px;
							background:url(../img/btn_l.png) no-repeat center center #fff;
							border-radius:50%;
							position:absolute;
							left:0;
							top:50%;
							cursor:pointer;
							margin-top:-25px;
							@media(max-width:1024px){
								width:40px;
								height: 40px;
								margin-top:-20px;
							}
							@media(max-width:550px){
								width:30px;
								height: 30px;
								margin-top:-15px;
								top:54%;
								background-size:auto 40%;
							}
						}
						.next{
							width:50px;
							height:50px;
							background:url(../img/btn_r.png) no-repeat center center #fff;
							border-radius:50%;
							position:absolute;
							right:0;
							top:50%;
							cursor: pointer;
							margin-top:-25px;
							@media(max-width:1024px){
								width:40px;
								height: 40px;
								margin-top:-20px;
							}
							@media(max-width:550px){
								width:30px;
								top:54%;
								height: 30px;
								margin-top:-15px;
								background-size:auto 40%;
							}
						}
						.box_cen{
							margin-top:40px;
							padding:0 7px;
							width:1200px;
							margin-left:auto;
							margin-right:auto;
							position:relative;	
							@media(max-width:1460px){
								width:83.3%;
							}
							@media(max-width:1024px){
								margin-top:30px;
								padding:0;
							}
							@media(max-width:500px){
								margin-top:10px;
							}
							.box_l{
								height:528px;
								@media(max-width:1460px){
									height: 500px;
								}
								@media(max-width:1300px){
									height: 440px;
								}
								@media(max-width:1200px){
									height: 380px;
								}
								@media(max-width:1024px){
									height: 300px;
								}
								@media(max-width:850px){
									height: 260px;
								}
								@media(max-width:800px){
									height: 410px;
								}
								@media(max-width:600px){
									height: 380px;
								}
								@media(max-width:500px){
									height:270px;
								}
								ul{
									li{
										position:absolute;
										width:100%;
										height: 100%;
										transition:all 0.5s;
										@include opacity(0);
										&.active{
											@include opacity(1);
											z-index:10;
										}
										.txt_box{
											width:264px;
											height:528px;
											position:absolute;
											left:0;
											top:0;
											padding-top:124px;
											@media(max-width:1460px){
												width:240px;
												height:500px;
											}
											@media(max-width:1300px){
												width:200px;
												height:440px;
												padding-top:95px;
											}
											@media(max-width:1200px){
												height: 380px;
												padding-top:70px;
											}
											@media(max-width:1024px){
												height: 300px;
												padding-top:50px;
											}
											@media(max-width:850px){
												height: 260px;
												padding-top:35px;
											}
											@media(max-width:800px){
												padding-top:0;
												width:360px;
												margin-left:auto;
												margin-right:auto;
												text-align: center;
												height: auto;
												position:static;
											}
											@media(max-width:600px){
												width:300px;
											}
											@media(max-width:500px){
												width:200px;
											}
											.t{
												@include fz(28px,44px);
												color:#fff;
												@extend .ellipsis;
												@media(max-width:1460px){
													@include fz(24px,40px);
												}
												@media(max-width:1024px){
													@include fz(20px,36px);
												}
												@media(max-width:800px){
													@include fz(18px,30px);
												}
											}
											.con{
												@include fz(14px,24px);
												color:#fff;
												margin-top:12px;
												height: 144px;
												overflow: hidden;
												@media(max-width:1460px){
													margin-top:8px;
												}
												@media(max-width:1300px){
													@include fz(13px,20px);
													height: 120px;
												}
												@media(max-width:1024px){
													@include fz(13px,20px);
													height: 100px;
													margin-top:5px;
												}
												@media(max-width:850px){
													height: 80px;
												}
												@media(max-width:800px){
													display: none;
												}
											}
										}
										.pic_box{
											width:528px;
											height: 528px;
											text-align: center;
											margin:0 auto;
											line-height: 528px;
											border-radius:50%;
											position:relative;
											background-color: #fff;
											box-shadow: 0 5px 46px rgba(156,156,156,.24);
											@media(max-width:1460px){
												width:500px;
												height: 500px;
												line-height:500px;
											}
											@media(max-width:1300px){
												width:440px;
												height: 440px;
												line-height:440px;
											}
											@media(max-width:1200px){
												width:380px;
												height: 380px;
												line-height:380px;
											}
											@media(max-width:1024px){
												width:300px;
												height: 300px;
												line-height:300px;
											}
											@media(max-width:850px){
												width:260px;
												height: 260px;
												line-height:260px;
											}
											@media(max-width:800px){
												width:360px;
												height: 360px;
												line-height:360px;
												margin-top:20px;
											}
											@media(max-width:600px){
												width:300px;
												height: 300px;
												line-height:300px;
											}
											@media(max-width:500px){
												width:200px;
												height: 200px;
												padding:0;
												line-height:200px;
											}
											img{
												max-width:80%;
												max-height:80%;
											}	
											.more{
												width:160px;
												height:46px;
												position:absolute;
												bottom:-23px;
												left:50%;
												margin-left:-80px;
												background: #c8a063;
												border-radius:46px;
												@include fz(16px,46px);
												color:#fff;
												text-align: center;
												cursor:pointer;
												@media(max-width:1200px){
													width:120px;
													border-radius:40px;
													height: 40px;
													bottom:-20px;
													margin-left:-60px;
													@include fz(14px,40px);
												}
												@media(max-width:500px){
													width:100px;
													height: 36px;
													@include fz(13px,36px);
													margin-left:-50px;
													bottom:-18px;
												}
											}
										}
									}
								}
							}
							.box_r{
								border: 3px solid rgba(255,255,255,.5);
								border-radius: 70px;
								width:140px;
								height: 140px;
								border-radius:50%;
								background-color: #309aeb;
								padding-top:40px;
								box-sizing:border-box;
								text-align: center;
								position:absolute;
								right:24px;
								top:50%;
								margin-top:-70px;
								@media(max-width:1460px){
									right:-1%;
									width:120px;
									height:120px;
									padding-top:20px;
								}
								@media(max-width:1024px){
									width:90px;
									height: 90px;
									padding-top:10px;
								}
								@media(max-width:800px){
									display: none;
								}
								.t{
									@include fz(24px,30px);
									color:#fff;
									@media(max-width:1460px){
										@include fz(20px,30px);
									}
									@media(max-width:1024px){
										@include fz(16px,24px);
									}
								}
								.en{
									margin-top:8px;
									@include fz(14px,16px);
									color:#fff;
									font-family:Arial;
									text-transform:uppercase;
									@media(max-width:1024px){
										margin-top:3px;
										@include fz(13px,16px);
									}
								}
							}
						}	
					}
				}
			}
			.product_bot{
				background-color: #fff;
				box-shadow: 0 5px 24px rgba(166,166,166,.3);
				.product_bot_cen{
					@media(max-width:750px){
						width:100%;
					}
					.swiper_pro{
						.swiper-container{
							.swiper-wrapper{
								height: auto !important;
								.swiper-slide{
									float:left;
									cursor:pointer;
									width:20%;
									height: auto !important; 
									&.active{
										.cont{
											background: #f2f2f2;
											&::after{
												transform:scaleX(1);
												transform-origin:left center;
											}
										}							
									}
									.cont{
										border-right:1px solid #eee;
										box-sizing:border-box;
										text-align: center;
										padding-top:20px;
										padding-bottom:10px;
										transition:background 0.38s cubic-bezier(0.4, 0, 0.2, 1);
										position:relative;
										@media(max-width:1200px){
											padding:15px 0;
										}
										&:hover{
											background: #f2f2f2;
											&::after{
												transform:scaleX(1);
												transform-origin:left center;
											}
										}
										&::after{
											content:'';
											position:absolute;
											width:100%;
											height:2px;
											background: #c8a063;
											display: block;
											bottom:0;
											transition:transform 0.38s cubic-bezier(0.4, 0, 0.2, 1);
											transform:scaleX(0);
											transform-origin:right center;
										}
										.tu{
											height: 80px;
											img{
												max-width:100%;
												max-height:100%;
											}
											@media(max-width:1200px){
												height: 60px;
											}
											@media(max-width:750px){
												height: 40px;
											}
											@media(max-width:500px){
												height: 30px;
											}
										}
										.txt{
											@include fz(14px,26px);
											color:#333;
											margin-top:5px;
											@extend .ellipsis;
											@media(max-width:1200px){
												@include fz(14px,24px);
											}
											@media(max-width:500px){
												@include fz(13px,20px);
											}
										}
									}
								}
							}
						}
					}
				}
			}
		}
	}
	.main_top{
		position: relative;
		.banner{
			height: 520px;
			// display: table;
			width: 100%;
			position: relative;
			@media(max-width: 1024px){
				background: none !important;
				height: auto;
			}
			img{
				display: none;
				width: 160%;
				margin-left: -30%;
				@media(max-width: 1024px){
					display: block;
				}
			}
			.text{
				width: 100%;
				height: 100%;
				text-align: center;
				@media(max-width: 1024px){
					position: absolute;
					left:0;
					top:0;
				}
				.table{
					display: table;
					height: 100%;
					width: 100%;
					.table-cell{
						display: table-cell;
						vertical-align: middle;
						h2{
							font-size: 70px;
							color: #fff;
							line-height: 66px;
							text-transform: uppercase;
							font-family: 'DIN-BLACKALTERNATE';
							text-shadow:0 2px 3px rgba(0,0,0,0.1);
							@media(max-width: 1024px){
								font-size: 30px;
								line-height: 26px;
							}
						}
						h4{
							font-size: 42px;
							color: #fff;
							line-height: 56px;
							text-shadow:0 2px 3px rgba(0,0,0,0.1);
							@media(max-width: 1024px){
								font-size:20px;
								line-height: 34px;
							}
						}
					}
				}
			}
		}
		.tab{
			width: 100%;
			height: 80px;
			background: #fff;
			@media(max-width: 1024px){
				display: none;
			}
			.w1200{
				overflow: hidden;
				.tit{
					float: left;
					background: url(../img/tit_bg.jpg) no-repeat;
					background-size: 100% 100%;
					width: 230px;
					padding-right:24px;
					height: 80px;
					overflow: hidden;
					@media(max-width: 1220px){
						width: 180px;
					}
					h6{
						text-align: center;
						font-size: 22px;
						color: #fff;
						line-height: 30px;
						margin-top: 18px;
					}
					.en{
						font-size: 14px;
						font-family: 'Arial';
						line-height: 16px;
						text-align: center;
						color: #72a4cf;
						text-transform: uppercase;
					}
				}
				.subnav{
					float: right;
					ul{
						overflow: hidden;
						li{
							float: left;
							padding:0 20px;
							@media(max-width: 1220px){
								padding:0 10px;
							}
							@media(max-width: 1220px){
								padding:0 6px;
							}
							a{
								display: block;
								overflow: hidden;
								span{
									font-size: 16px;
									color: #333333;
									float: left;
									line-height: 80px;
									transition:all 0.3s;
								}
								.icon{
									width: 18px;
									height: 18px;
									background: url(../img/subnav-icon.jpg) no-repeat;
									background-size: cover;
									float: left;
									margin:32px 0 0 7px;
									transition:all 0.3s;
									@media(max-width: 1220px){
										margin:32px 0 0 4px;
									}
								}
							}
							a:hover{
								span{
									color: #005baa;
								}
								.icon{
									background: url(../img/subnav-icon_h.jpg) no-repeat;
									background-size: cover;
								}
							}
						}
						li.active{
							a{
								span{
									color: #005baa;
								}
								.icon{
									background: url(../img/subnav-icon_h.jpg) no-repeat;
									background-size: cover;
								}
							}
						}
						li:last-child{
							padding:0 0 0 20px;
							@media(max-width: 1220px){
								padding:0 0 0 10px;
							}
							@media(max-width: 1220px){
								padding:0 0 0 6px;
							}
						}
					}
				}
			}
		}
		.tabs_m{
			display: none;
			position: relative;
			z-index: 100;
			padding:0;
			overflow:inherit;
			@media(max-width: 1024px){
				display: block;
			}
			.tabs_tit{
				overflow: hidden;
			    padding: 0 0.6rem 0 0.2rem;
			    background: #fff;
			    position: relative;
			    line-height: 0.7rem;
			    height: 0.7rem;
			    z-index: 2;
		        box-shadow: 0 0.04rem 0.1rem 0 rgba(2,0,10,0.15);
				h6{
				    font-size: 0.28rem;
				    color:#333333;
				    font-weight: normal;
				    display: block;
				    white-space: nowrap;
				    overflow: hidden;
				    text-overflow: ellipsis;
				    text-transform: inherit;
				    font-family: 'AVGARDM';
				}
				.icon{
					width: 0.75rem;
					height: 0.7rem;
					background: #005baa;
					position: absolute;
					right: 0;
					top:0;
					span{
						width:0.25rem;
						height: 0.15rem;
						position: absolute;
						left: 50%;
						top:50%;
						margin:-0.07rem 0 0 -0.12rem;
						background: url(../img/tabs_m_icon.png) no-repeat;
						background-size: cover;
						transition:all 0.3s;
					}
				}
			}
			.tabs_tit.on{
				.icon{
					span{
						transform:rotate(180deg);
					}
				}
			}
			.tabs_con{
			    position: absolute;
			    left: 0;
			    top: 0.7rem;
			    width: 100%;
			    background: #fff;
			    display: none;
			    z-index: 1;
			    box-shadow: 0 0.04rem 0.1rem 0 rgba(2,0,10,0.15);
			    ul{
			    	li{
		    		    border-top: 1px solid #f1f1f1;
						padding: 0 0.17rem;
			    		a{
		    			    line-height: 0.76rem;
						    font-size: 0.26rem;
						    color: #333333;
						    display: block;
						    white-space: nowrap;
						    overflow: hidden;
						    text-overflow: ellipsis;
						    width: 100%;
						    float:inherit;
						    background: #fff;
						    text-align: left;
						    margin-bottom: 0;
						    font-family: 'AVGARDM';
			    		}
			    	}
			    }
			}
		}
	}	
	.news_box{
		padding-top:90px;
		padding-bottom:124px;
		&.none{
			padding-bottom: 0;
		}
		@media(max-width:1024px){
			padding-top:70px;
			padding-bottom:90px;
		}
		@media(max-width:600px){
			padding-top:30px;
			padding-bottom:35px;
		}
		.title{
			.cn{
				color:#333;
			}
			.en{
				color:#999;
			}
		}
		.detail{
			padding-top:65px;
			padding-bottom:100px;
			.title2{
				position:relative;
				padding-bottom:16px;
				border-bottom:1px solid #ededed;
				.tit{
					padding-right:0px;
					box-sizing:border-box;
					.t{
						@include fz(24px,44px);
						color:#333;
					}
					.day{
						@include fz(14px,20px);
						color:#696969;
						margin-top:6px;
						background:url(../img/ttt.png) no-repeat left center;
						padding-left:28px;
					}
				}
				.share{
					position:absolute;
					right:0;
					top:10px;
					span{
						@include fz(14px,32px);
						color:#666;
						display: inline-block;
						vertical-align:middle;
						margin-right:7px;
					}
					.bdsharebuttonbox{
						display: inline-block;
						vertical-align:middle;
						a{
							padding:0;
						}
						.bds_tsina{
							width:32px;
							height:32px;
							background:url(../img/sina.png) no-repeat;
						}
						.bds_weixin{
							width:32px;
							height:32px;
							background:url(../img/wx.png) no-repeat;
						}
						.bds_qzone{
							width:32px;
							height:32px;
							background:url(../img/qz.png) no-repeat;
						}
					}
				}
			}
			.content{
				padding-top:7px;
				@include fz(15px,26px);
				border-bottom:1px solid #ededed;
				padding-bottom:45px;
				color:#565656;
				img{
					max-width:100%;
					height: auto !important;
				}
				p{
					text-indent:2em;
					padding-top:20px;
				}
			}
			.page{
				margin-top:42px;
				position:relative;
				.left2{
					width:100%;
					box-sizing:border-box;
					padding-right:210px;
					a{
						@extend .ellipsis;
						display: block;
						@include fz(16px,28px);
						color:#666;
						@media(min-width:1024px){
							&:hover{
								color:$color;
							}
						}
					}
				}
				.return{
					position:absolute;
					right:0;
					top:0;
					width:200px;
					height:58px;
					display: block;
					border-radius:58px;
					background:$color;
					font-size:16px;
					line-height:58px;
					color:#fff;
					text-align: center;
				}
			}
			@media(max-width:1420px){
				padding-top:55px;
				padding-bottom:80px;
				.title2{
					.tit{
						.t{
							@include fz(20px,30px);
						}
						.day{
							font-size:13px;
						}
					} 
				}
				.content{
					@include fz(14px,24px);
					padding-bottom:30px;
				}
				.page_box{
					margin-top:30px;
					.left2{
						a{
							font-size:14px;
							line-height:24px;
						}
					}
					.return{
						width:160px;
						height:50px;
						font-size:14px;
						line-height:50px; 
					}
				}
			}
			@media(max-width:1024px){
				padding-top:40px;
				padding-bottom:60px;
				.title2{
					.tit{
						.t{
							@include fz(16px,24px);
						}
						.day{
							font-size:13px;
							background-size:14px 14px;
							padding-left:20px;
						}
					} 
				}
				.content{
					@include fz(14px,24px);
					padding-bottom:25px;
				}
				.page_box{
					margin-top:25px;
					.left2{
						padding-right:160px;
						a{
							font-size:14px;
							line-height:24px;
						}
					}
					.return{
						width:140px;
						height:40px;
						font-size:14px;
						line-height:40px; 
					}
				}
			}
			@media(max-width:650px){
				padding-bottom:40px;
				padding-top:30px;
				.title2{
					.tit{
						padding-right:0;
					}
					.share{
						position:static;
					}
				}
				.content{
					@include fz(14px,24px);
					padding-bottom:25px;
					p{
						padding-top:15px;
					}
				}
				.page_box{
					margin-top:25px;
					.left2{
						padding-right:110px;
						a{
							font-size:14px;
							line-height:24px;
						}
					}
					.return{
						width:100px;
						height:36px;
						font-size:14px;
						line-height:36px; 
						top:6px;
					}
				}
			}
		}
		.wrap{
			.wl{
				background: #fff;
				padding:0 40px 45px 40px;
				box-sizing:border-box;
				box-shadow: 0 5px 40px rgba(142,142,142,.1);
				margin-top:52px;
				position:relative;
				width:48.4%;
				@media(max-width:1024px){
					padding:0 30px 30px 30px;
					margin-top:40px;
				}
				@media(max-width:700px){
					width:100%;
				}
				@media(max-width:600px){
					padding:0 20px 25px 20px;
					margin-top:25px;
				}
				.tit{
					@include fz(24px,42px);
					color:#333;
					font-weight:bold;
					padding-top:32px;
					padding-bottom:25px;
					@media(max-width:1024px){
						@include fz(20px,32px);
					}
					@media(max-width:600px){
						@include fz(18px,24px);
						padding-top:20px;
						padding-bottom: 15px;
					}
					a{
						color:#333;
						transitin:all 0.5s;
						@media(min-width:1024px){
							&:hover{
								color:$color;
							}
						}
					}
				}
				.swiper_box{
					.owl-controls{
						position:absolute;
						width:100%;
						left:0;
						top:-45px;
						@media(max-width:600px){
							top:-30px;
						}
						.owl-dots{
							text-align:right;
							width:100%;
							font-size:0;
							.owl-dot{
								margin-left:5px;
								width:12px;
								height:12px;
								background: #a0a0a0;
								border-radius:50%;
								display: inline-block;
								vertical-align: top;
								&.active{
									background: #c8a063;
								}
								@media(max-width:600px){
									width:10px;
									height:10px;
								}
							}
						}
					}
					.pic_box{
						position:relative;
						@media(min-width:1024px){
							&:hover{
								.pic{
									.img{
										transform:scale(1.05);
									}
								}
							}
						}
						.pic{
							overflow: hidden;
							a{
								display: none;
								&.show{
									display: block;
								}
							}
							.img{
								width:100%;
								height: auto;
								transition:all 0.5s ease-in-out;
							}
							.img_box{
								display: none;
							}
						}
						.txt_box{
							position:absolute;
							display: block;
							width:100%;
							bottom:0;
							left:0;
							background:rgba(0,0,0,0.6);
							@include fz(16px,56px);
							color:#fff;
							padding:0 25px;
							@extend .ellipsis;
							z-index:10;
							box-sizing:border-box;
							@media(max-width:600px){
								@include fz(14px,36px);
								padding:0 15px;
							}
						}
					}
				}
			}
		}
		.compamy_news{
			background: #fff;
			padding:0 40px;
			box-sizing:border-box;
			box-shadow: 0 5px 40px rgba(142,142,142,.1);
			margin-top:52px;
			position:relative;
			&.compamy_news2{
				box-shadow:none;
				padding:0;
				background:none;
			}
			@media(max-width:1024px){
				padding:0 30px;
				margin-top:40px;
			}
			@media(max-width:600px){
				padding:0 20px;
				margin-top:25px;
			}
			.tit{
				@include fz(24px,42px);
				color:#333;
				font-weight:bold;
				padding-top:32px;
				padding-bottom:25px;
				@media(max-width:1024px){
					@include fz(20px,32px);
				}
				@media(max-width:600px){
					@include fz(18px,24px);
					padding-top:20px;
					padding-bottom: 15px;
				}
				a{
					color:#333;
					transitin:all 0.5s;
					@media(min-width:1024px){
						&:hover{
							color:$color;
						}
					}
				}
			}
			.box{
				padding-bottom:40px;
				@media(max-width:1024px){
					padding-bottom:30px;
				}
				.box_r{
					width:46.5%;
					float:right;
					@media(max-width:800px){
						width:100%;
						float:none;
						margin-top:25px;
					}
					ul{
						li{
							margin-top:33px;
							&:first-child{
								margin-top:0;
							}
							@media(max-width:1300px){
								margin-top:20px;
							}
							@media(max-width:500px){
								margin-top:15px;
							}
							a{
								overflow: hidden;
								display: block;
								position:relative;
								@media(min-width:1024px){
									&:hover{
										.pic{
											img{
												transform:scale(1.05);
											}
										}
										.cont{
											.t{
												color:#c8a063;
											}
										}
									}
								}
								.pic{
									float:left;
									overflow: hidden;
									width:42%;
									@media(max-width:450px){
										width:50%;
									}
									img{
										width:100%;
										transition:all 0.5s ease-in-out;
									}
								}
								.cont{
									width:54.1%;
									float:right;
									@media(max-width:450px){
										width:46%;
									}
									.t{
										@include fz(20px,30px);
										color:#333;
										@extend .ellipsis;
										transition:color 0.5s ease-in;
										@media(max-width:1024px){
											@include fz(18px,28px);
										}
										@media(max-width:600px){
											@include fz(16px,24px);
										}
									}
									.con{
										@include fz(14px,26px);
										color:#777;
										margin-top: 12px;
										height:78px;
										overflow: hidden;
										@media(max-width:1300px){
											line-height:24px;
											margin-top:10px;
											height: 72px;
										}
										@media(max-width:1200px){
											height: 48px;
										}
										@media(max-width:950px){
											@include fz(13px,20px);
											height: 40px;
											margin-top:6px;
										}
										@media(max-width:800px){
											@include fz(14px,24px);
											height:72px;
										}
										@media(max-width:600px){
											height: 48px;
										}
										@media(max-width:450px){
											@include fz(13px,20px);
											height: 40px;
											margin-top:3px;
										}
									}
									.date{
										@include fz(14px,24px);
										color:#bebdbd;
										margin-top:8px;
										@media (max-width:1024px) {
											margin-top:5px;
										}
										@media(max-width:450px){
											@include fz(13px,20px);
											margin-top:3px;
										}
									}
								}
							}
						}
					}
				}
				.box_l{
					float:left;
					width:49.7%;
					@media(max-width:800px){
						width:100%;
						float:none;
					}
					a{
						display: block;
						@media(min-width:1024px){
							&:hover{
								.pic{
									img{
										transform:scale(1.05);
									}
								}
								.cont{
									.t{
										color:#c8a063;
									}
								}
							}
						}
						.pic{
							overflow: hidden;
							img{
								transition:all 0.5s ease-in-out;
								width:100%;
								height:auto;
							}
						}
						.cont{
							padding-top:25px;
							@media(max-width:900px){
								padding-top:15px;
							}
							@media(max-width:450px){
								padding-top:10px;
							}
							.t{
								@include fz(24px,36px);
								color:#333;
								@extend .ellipsis;
								transition:color 0.5s ease-in;
								@media(max-width:1024px){
									@include fz(20px,32px);
								}
								@media(max-width:600px){
									@include fz(18px,24px);
								}
							}
							.con{
								margin-top:12px;
								@include fz(14px,26px);
								color:#666;
								height: 78px;
								overflow: hidden;
								@media(max-width:1300px){
									line-height:24px;
									margin-top:10px;
									height: 72px;
								}
								@media(max-width:1200px){
									height: 48px;
								}
								@media(max-width:900px){
									@include fz(13px,20px);
									height: 40px;
								}
								@media(max-width:800px){
									@include fz(14px,24px);
									height:48px;
								}
								@media(max-width:450px){
									margin-top:5px;
								}
							}
							.date{
								@include fz(14px,28px);
								color:#bebdbd;
								margin-top:10px;
								@media(max-widdth:1300px){
									margin-top:5px;
								}
								@media(max-width:600px){
									@include fz(13px,20px);
									margin-top:3px;
								}
							}
						}
					}
				}
			}
			.video{
				width:36.66%;
				position:absolute;
				right:0;
				top:0;
				height:100%;
				cursor:pointer;
				@media(min-width:1024px){
					&:hover{
						.video_txt{
							transform:translateY(-20px);
						}
					}
				}
				@media(max-width:800px){
					width:100%;
					margin-top:25px;
					position:relative;
					padding-top:102%;
				}
				.mask{
					position:absolute;
					width:100%;
					height:100%;
					background:rgba(0,0,0,0.5);
					left:0;
					top:0;
				}
				.video_txt{
					position:absolute;
					left:0;
					width:100%;
					text-align: center;
					top:50%;
					margin-top:-67.5px;
					transition:transform 0.5s ease;
					@media(max-width:1200px){
						margin-top:-50px;
					}
					@media(max-width:600px){
						margin-top:-35px;
					}
					.ico{
						width:76px;
						height:76px;
						margin:0 auto;
						overflow: hidden;
						img{
							width:100%;
							height:auto;
						}
						@media(max-width:1200px){
							width:60px;
							height: 60px;
						}
						@media(max-width:600px){
							width:40px;
							height:40px;
						}
					}
					.txt{
						@include fz(24px,44px);
						color:#fff;
						font-weight:bold;
						margin-top:15px;
						@media(max-width:1200px){
							font-size:20px;
							line-height:30px;
							margin-top:10px;
						}
						@media(max-width:600px){
							@include fz(18px,24px);
							margin-top:6px;
						}
					}
				}
			}
			.media_l{
				width:60.2%;
				background: #fff;
				padding:0 40px;
				box-sizing:border-box;
				box-shadow: 0 5px 40px rgba(142,142,142,.1);
				@media(max-width:1024px){
					padding:0 30px;
				}
				@media(max-width:800px){
					width:100%;
				}
				@media(max-width:600px){
					padding:0 20px;
				}
				.list{
					padding-bottom:63px;
					@media(max-width:1024px){
						padding-bottom:40px;
					}
					@media(max-width:600px){
						padding-bottom:25px;
					}
					ul{
						li{
							margin-top:40px;
							&:first-child{
								margin-top:0;
							}
							@media(max-width:1200px){
								margin-top:30px;
							}
							@media(max-width:600px){
								margin-top:15px;
							}
							a{
								position:relative;
								padding-left:115px;
								min-height:94px;
								display: block;
								@media(max-width:1200px){
									min-height:80px;
								}
								@media(max-width:600px){
									padding-left: 85px;
								}
								@media(min-width:1024px){
									&:hover{
										.cont{
											.t{
												color:$color;
											}
										}
									}
								}
								.date{
									width:84px;
									height:94px;
									text-align: center;
									background: #c8a063;
									position:absolute;
									left:0;
									top:0;
									@media(max-width:1200px){
										height:80px;
									}
									@media(max-width:600px){
										width:70px;
									}
									.tab{
										width:100%;
										height:100%;
										display:table;
										.tab_cell{
											display: table-cell;
											vertical-align: middle;
											.day{
												@include fz(38px,40px);
												color:#fff;
												font-family:Arial ;
												@media(max-width:1200px){
													@include fz(30px,32px);
												}
												@media(max-width:600px){
													@include fz(24px,26px);
												}
											}
											.month{
												@include fz(14px,20px);
												font-family: Arial;
												color:#fff;
											}
										}
									}
								}
								.cont{
									margin-top:3px;
									.t{
										@include fz(20px,30px);
										color:#333;
										transition:color 0.5s ease-in;
										@extend .ellipsis;
										@media(max-width:1024px){
											@include fz(18px,28px);
										}
										@media(max-width:600px){
											@include fz(16px,24px);
										}
									}
									.con{
										@include fz(14px,24px);
										color:#777;
										height: 48px;
										overflow: hidden;
										margin-top:7px;
									}
								}
							}
						}
					}
				}
			}
			.news_list{
				padding-bottom:33px;
				@media(max-width:600px){
					padding-bottom:15px;
				}
				ul{
					width:110%;
					@media(max-width:700px){
						width:100%;
					}
					li{
						float:left;
						width:28%;
						margin-right:3.3%;
						@media(max-width:700px){
							width:100%;
							margin-right:0;
							margin-top:15px;
							&:nth-child(1){
								margin-top:0;
							}
						}
						a{
							display: block;
							@media(min-width:1024px){
								&:hover{
									.pic{
										img{
											transform:scale(1.05);
										}
									}
								}
							}
							.pic{
								overflow: hidden;
								img{
									width:100%;
									transition:all 0.5s ease-in-out;
									height: auto;
								}
							}
							.cont{
								padding-top:18px;
								.t{
									@include fz(20px,36px);
									color:#333;
									@extend .ellipsis;
									@media(max-width:1024px){
										@include fz(18px,28px);
									}
									@media(max-width:600px){
										@include fz(16px,24px);
									}
								}
								.con{
									@include fz(14px,24px);
									color:#666;
									overflow: hidden;
									height: 48px;
									margin-top: 8px;
								}
								.date{
									@include fz(14px,26px);
									color:#bebdbd;
									margin-top:8px;
								}
							}
						}
					}
				}
			}
		}
		
		
		.swiper_news{
			margin-top:60px;
			@media(max-width:1024px){
				margin-top:40px;
			}
			@media(max-width:600px){
				margin-top:25px;
			}
			.swiper-container{
				// height: auto !important;
				// .swiper-wrapper{
				// 	height: auto !important;
				// 	.swiper-slide{
				// 		height: auto !important;
				// 		a{
				// 			position:relative;
				// 			display: block;
				// 			overflow: hidden;
				// 			margin-left:1px;
				// 			@media(max-width:750px){
				// 				margin:0;
				// 			}
				// 			.pic{
				// 				width:48.6%;
				// 				overflow: hidden;
				// 				img{
				// 					width:100%;
				// 					height: auto;
				// 				}
				// 				@media(max-width:750px){
				// 					width:100%;
				// 					float:none;
				// 				}
				// 			}
				// 			.cont{
				// 				position:absolute;
				// 				width:51.4%;
				// 				height:100%;
				// 				right:0;
				// 				top:0;
				// 				padding:0 4.1%;
				// 				background: #fff;
				// 				box-sizing:border-box;
				// 				@media(max-width:750px){
				// 					width:100%;
				// 					position:static;
				// 					padding:20px;
				// 				}
				// 				@media(max-width:500px){
				// 					padding:20px 15px;
				// 				}
				// 				.conn{
				// 					padding-top:10%;
				// 					@media(max-width:1200px){
				// 						padding-top:6%;
				// 					}
				// 					@media(max-width:900px){
				// 						padding-top:3%;
				// 					}
				// 					@media(max-width:750px){
				// 						padding:0;
				// 					}
				// 					.date{
				// 						@include fz(16px,22px);
				// 						color:$color;
				// 						font-family: "AVANTGARDEITCBYBT-DEMI";
				// 						@media(max-width:800px){
				// 							@include fz(14px,20px);
				// 						}
				// 						i{
				// 							font-size:24px;
				// 							margin:0 3px;
				// 							font-style:normal;
				// 							@media(max-width:800px){
				// 								font-size:20px;
				// 							}
				// 						}
				// 						span{
				// 							display: inline-block;
				// 							vertical-align: bottom;
				// 							@include fz(46px,46px);
				// 							@media(max-width:1300px){
				// 								@include fz(40px,40px);
				// 							}
				// 							@media(max-width:800px){
				// 								@include fz(30px,30px);
				// 							}
				// 							@media(max-width:600px){
				// 								@include fz(22px,22px);
				// 							}
				// 						}
										
				// 					}
				// 					.t{
				// 						@include fz(24px,40px);
				// 						color:#333;
				// 						@extend .ellipsis;
				// 						margin-top:14px;
				// 						@media(max-width:1300px){
				// 							@include fz(20px,36px);
				// 						}
				// 						@media(max-width:1024px){
				// 							margin-top:8px;
				// 						}
				// 						@media(max-width:800px){
				// 							@include fz(18px,24px);
				// 							margin-top:5px;
				// 						}
				// 						@media(max-width:600px){
				// 							@include fz(16px,24px);
				// 						}
				// 					}
				// 					.con{
				// 						@include fz(14px,26px);
				// 						color:#666;
				// 						height:78px;
				// 						overflow: hidden;
				// 						margin-top:10px;
				// 						@media(max-width:1300px){
				// 							line-height:24px;
				// 							height:72px;
				// 						}
				// 						@media(max-width:980px){
				// 							height:48px;
				// 							margin-top:5px;
				// 						}
				// 					}
				// 					.more{
				// 						margin-top:46px;
				// 						width:160px;
				// 						height:44px;
				// 						background:$color;
				// 						@include fz(14px,46px);
				// 						color:#fff;
				// 						text-align: center;
				// 						@media(max-width:1300px){
				// 							height:40px;
				// 							line-height:40px;
				// 							margin-top:30px;
				// 							width:130px;
				// 						}
				// 						@media(max-width:1200px){
				// 							margin-top:20px;
				// 						}
				// 						@media(max-width:900px){
				// 							margin-top:15px;
				// 							width:110px;
				// 							height:36px;
				// 							line-height:36px;
				// 						}
				// 						@media(max-width:600px){
				// 							margin-top:10px;
				// 							width:100px;
				// 							height:36px;
				// 							font-size:13px;
				// 							line-height:36px;
				// 						}
				// 					}
				// 				}
								
				// 			}
				// 		}
				// 	}
				// }
				.swiper-slide{
						height: auto !important;
						a{
							position:relative;
							display: block;
							overflow: hidden;
							margin-left:1px;
							@media(max-width:750px){
								margin:0;
							}
							.pic{
								width:48.6%;
								overflow: hidden;
								img{
									width:100%;
									height: auto;
								}
								@media(max-width:750px){
									width:100%;
									float:none;
								}
							}
							.cont{
								position:absolute;
								width:51.4%;
								height:100%;
								right:0;
								top:0;
								padding:0 4.1%;
								background: #fff;
								box-sizing:border-box;
								@media(max-width:750px){
									width:100%;
									position:static;
									padding:20px;
								}
								@media(max-width:500px){
									padding:20px 15px;
								}
								.conn{
									padding-top:10%;
									@media(max-width:1200px){
										padding-top:6%;
									}
									@media(max-width:900px){
										padding-top:3%;
									}
									@media(max-width:750px){
										padding:0;
									}
									.date{
										@include fz(16px,22px);
										color:$color;
										font-family: "AVANTGARDEITCBYBT-DEMI";
										@media(max-width:800px){
											@include fz(14px,20px);
										}
										i{
											font-size:24px;
											margin:0 3px;
											font-style:normal;
											@media(max-width:800px){
												font-size:20px;
											}
										}
										span{
											display: inline-block;
											vertical-align: bottom;
											@include fz(46px,46px);
											@media(max-width:1300px){
												@include fz(40px,40px);
											}
											@media(max-width:800px){
												@include fz(30px,30px);
											}
											@media(max-width:600px){
												@include fz(22px,22px);
											}
										}
										
									}
									.t{
										@include fz(24px,40px);
										color:#333;
										@extend .ellipsis;
										margin-top:14px;
										@media(max-width:1300px){
											@include fz(20px,36px);
										}
										@media(max-width:1024px){
											margin-top:8px;
										}
										@media(max-width:800px){
											@include fz(18px,24px);
											margin-top:5px;
										}
										@media(max-width:600px){
											@include fz(16px,24px);
										}
									}
									.con{
										@include fz(14px,26px);
										color:#666;
										height:78px;
										overflow: hidden;
										margin-top:10px;
										@media(max-width:1300px){
											line-height:24px;
											height:72px;
										}
										@media(max-width:980px){
											height:48px;
											margin-top:5px;
										}
									}
									.more{
										margin-top:46px;
										width:160px;
										height:44px;
										background:$color;
										@include fz(14px,46px);
										color:#fff;
										text-align: center;
										@media(max-width:1300px){
											height:40px;
											line-height:40px;
											margin-top:30px;
											width:130px;
										}
										@media(max-width:1200px){
											margin-top:20px;
										}
										@media(max-width:900px){
											margin-top:15px;
											width:110px;
											height:36px;
											line-height:36px;
										}
										@media(max-width:600px){
											margin-top:10px;
											width:100px;
											height:36px;
											font-size:13px;
											line-height:36px;
										}
									}
								}
								
							}
						}
					}
			}
			.control{
				text-align: center;
				font-size:0;
				margin-top:30px;
				@media(max-width:500px){
					margin-top:15px;
				}
				.btn{
					width:35px;
					height:35px;
					cursor:pointer;
					display: inline-block;
					vertical-align: middle;
					@media(max-width:500px){
						width:30px;
						height:30px;
					}
					&.btn_l{
						background:url(../img/bl.png) no-repeat;
						background-size:cover;
					}
					&.btn_r{
						background:url(../img/bl2.png) no-repeat;
						background-size:cover;
					}
				}
				.process{
					width:800px;
					height:2px;
					background: #e1e1e1;
					position:relative;
					display: inline-block;
					vertical-align: middle;
					margin:0 25px;
					@media(max-width:1100px){
						width:600px;
					}
					@media(max-width:850px){
						margin:0 15px;
						width:450px;
					}
					@media(max-width:700px){
						width:300px;
					}
					@media(max-width:500px){
						width:200px;
						margin:0 10px;
					}
					.bar{
						position:absolute;
						left:0;
						top:0;
						bottom:0;
						width:0%;
						background:$color;
					}
				}
			}
		}
		.news_list_box{
			margin-top:8px;
			ul{
				padding-bottom:100px;
				width:110%;
				@media(max-width:1024px){
					padding-bottom:80px;
				}
				@media(max-width:600px){
					padding-bottom: 30px;
				}
				@media(max-width:800px){
					width:100%;
				}
				li{
					float:left;
					width:29%;
					margin-right:1.8%;
					background: #fff;
					display: block;
					margin-top:2.8%;
					transition:box-shadow 0.5s ease-in-out;
					@media(min-width:1024px){
						&:hover{
							box-shadow: 0 5px 40px rgba(142,142,142,.4);
							.pic{
								img{
									transform:scale(1.05);
								}
							}
							.cont{
								// padding-bottom:0;
								.cont_bot{
									transform:translateY(25px);
								}
								.cont_top{
									.more{
										transform:translateY(0px);
										@include opacity(1);
									}
								}
							}
							
						}
					}
					@media(max-width:800px){
						width:48%;
						margin-right:0;
						margin-top:4%;
						&:nth-child(even){
							float: right;
						}
					}
					@media(max-width:600px){
						width:100%;
						float:none;
						margin-right:0;
						margin-top:15px;
						&:nth-child(even){
							float:none;
						}
					}
					.pic{
						display: block;
						overflow: hidden;
						img{
							width:100%;
							transition:all 0.5s ease-in-out;
							height:auto;
						}
					}
					.cont{
						padding:30px;
						padding-bottom:0;
						transition:all 0.5s ease-out;
						@media(max-width:1300px){
							padding:20px;
							padding-bottom:0;
						}
						@media(max-width:600px){
							padding:20px 15px;
							padding-bottom:0;
						}
						.cont_bot{
							height:84px;
							transition:all 0.5s ease-in-out;
							border-top:1px solid #eeeeee;
							@media(max-width:1024px){
								height: auto;
							}
							.year{
								float:left;	
								@include fz(14px,52px);
								color:#333;
								@media(max-width:1024px){
									height: 40px;
									line-height:40px;
								}
							}
							.bdsharebuttonbox{
								float:right;
								.popup_more{
									margin:0;
									width: 17px;
									height:52px;
									background:url(../img/share.png) no-repeat center center;
									padding:0;
									@media(max-width:1024px){
										height: 40px;
									}
								}
							}
						}
						.cont_top{
							display: block;
							padding-bottom:60px;
							position:relative;
							box-sizing:border-box;
							transition:all 0.5s ease-in-out;
							@media(max-width:1200px){
								padding-bottom:30px;
							}
							@media(max-width:1024px){
								padding-bottom:15px;
							}
							
							.t{
								@include fz(20px,30px);
								color:#333;
								@extend .ellipsis;
								@media(max-width:1300px){
									@include fz(18px,24px);
								}
								@media(max-width:600px){
									@include fz(16px,24px);
								}
							}
							.con{
								margin-top:10px;
								@include fz(14px,24px);
								color:#666;
								height:48px;
								overflow: hidden;
								@media(max-width:600px){
									margin-top:7px;
								}
							}
							.more{
								width:120px;
								height:34px;
								transition:all 0.5s ease-out;
								background:$color;
								@include fz(14px,34px);
								color:#fff;
								text-align: center;	
								margin-top:24px;
								position:absolute;
								bottom:0px;
								left:0;
								transform:translateY(-20px);
								@include opacity(0);
								@media(max-width:1200px){
									bottom:-15px;
								}
								@media(max-width:1024px){
									position:static;
									@include opacity(1);
									transform:translate(0,0);
									margin-top:15px;
								}
								@media(max-width:600px){
									width:100px;
									height:36px;
									line-height:36px;
								}
							}
						}
					}
				}
			}
		}
		.event_list{
			padding-bottom:14px;
			@media(max-width:600px){
				padding-bottom:0;
				padding-top:10px;
			}
			ul{
				li{
					margin-top:58px;
					position:relative;
					@media(max-width:1200px){
						margin-top:40px;
					}
					@media(max-width:1024px){
						background: #fff;
					}
					@media(max-width:800px){
						margin-top:25px;
					}
					@media(max-width:600px){
						margin-top:15px;
					}
					@media(min-width:1024px){
						&:hover{
							.bg{
								transform:scaleY(1);
								transform-origin:top center;
							}
							a{
								box-shadow:0px 0px 40px 2px rgba(#8e8e8e,0.1);
								.pic{
									box-shadow:0 0 0 0 rgba(#8e8e8e,0.1);
									img{
										transform:scale(1.05);
									}
								}
							}
							
						}
					}
					.bg{
						position:absolute;
						left:0;
						top:0;
						width:100%;
						height:100%;
						background: #fff;
						transform-origin:bottom center;
						transform:scaleY(0);
						transition:transform 0.5s;
					}
					a{
						display: block;
						position:relative;
						z-index:10;
						transition:background 0.5s ease-in-out;
						
						.pic{
							float: left;
							width:56.9%;
							overflow: hidden;
							// box-shadow:0px 0px 40px 2px rgba(#8e8e8e,0.1);
							transition:all 0.3s;
							img{
								width:100%;
								transition:all 0.5s ease-in-out;
								height: auto;
							}
							@media(max-width:800px){
								width:100%;
								float:none;
							}
						}
						.cont{
							position:absolute;
							width:43.1%;
							right:0;
							top:0;
							height:100%;
							padding:0 3.8%;
							box-sizing:border-box;
							@media(max-width:800px){
								width:100%;
								padding:20px;
								position:static;
							}
							@media(max-width:600px){
								padding:20px 15px;
							}
							.tab{
								width:100%;
								height:100%;
								display:table;
								@media(max-width:800px){
									display: block;
								}
								.tab_cell{
									display: table-cell;
									vertical-align: middle;
									@media(max-width:800px){
										display: block;
										.con_box{
											width:100% !important;
										}
									}
									.name{
										@include fz(16px,26px);
										color:$color;
										@media(max-width:1024px){
											@include fz(15px,24px);
										}
									}
									.ti{
										margin-top:10px;
										@include fz(32px,42px);
										color:#333;
										@extend .ellipsis;
										@media(max-width:1400px){
											@include fz(28px,36px);
										}
										@media(max-width:1024px){
											@include fz(24px,30px);
										}
										@media(max-width:750px){
											@include fz(20px,30px);
											margin-top:5px;
										}
									}
									.con{
										@include fz(14px,26px);
										color:#666;
										height:52px;
										overflow: hidden;
										margin-top:35px;
										@media(max-width:1400px){
											@include fz(14px,24px);
											height:48px;
											margin-top:25px;
										}
										@media(max-width:1024px){
											margin-top:15px;
										}
										@media(max-width:750px){
											margin-top:6px;
										}
									}
									.more{
										width:160px;
										height:44px;
										background:$color;
										@include fz(14px,44px);
										color:#fff;
										text-align: center;
										margin-top: 17%;
										@media(max-width:1400px){
											margin-top:12%;
										}
										@media(max-width:1024px){
										    width: 110px;
										    height: 36px;
										    margin-top: 15px;
										    line-height: 36px;
										}
										@media(max-width:600px){
											margin-top:10px;
										    width: 110px;
										    height: 36px;
										    line-height: 36px;
										}
									}
								}
							}
						}
					}
				}
			}
		}
	}
	.strength{
		padding-top:90px;
		padding-bottom:124px;
		@media(max-width:1024px){
			padding-top:70px;
			padding-bottom:90px;
		}
		@media(max-width:600px){
			padding-top:25px;
			padding-bottom:35px;
		}
		.title{
			.cn{
				color:#333;
			}
			.en{
				color:#999;
			}
		}
		.box{
			margin-top:54px;
			@media(max-width:1024px){
				margin-top:40px;
			}
			@media(max-width:600px){
				margin-top:20px;
			}
			.fix{
				float:left;
				width:11.8%;
				position:relative;
				&.fixed{
					position:fixed;
					top:100px;
				}
				@media(max-width:1024px){
					display: none;
				}
				.line{
					position:absolute;
					width:1px;
					height:100%;
					background: #ccc;
					&::before{
						content:'';
						display:block;
						width:8px;
						height:8px;
						position:absolute;
						border-radius:50%;
						left:50%;
						background: #fafafa;
						margin-left:-4px;
						top:0;
						border:1px solid #cdcdcd;
						box-sizing:border-box;
					}
					&::after{
						content:'';
						display:block;
						width:8px;
						height:8px;
						position:absolute;
						background: #fafafa;
						box-sizing:border-box;
						left:50%;
						border-radius:50%;
						margin-left:-4px;
						bottom:0;
						border:1px solid #cdcdcd;
					}
				}
				ul{
					padding:45px 0;
					li{
						@include fz(14px,24px);
						color:#333;
						padding-left:40px;
						position:relative;
						margin-top:25px;
						z-index:10;
						cursor:pointer;
						&:first-child{
							margin-top:0;
						}
						&.active{
							.ico{
								.active{
									transform:scale(1);
								}
							}
						}
						@media(min-width:1024px){
							&:hover{
								.ico{
									.active{
										transform:scale(1);
									}
								}
							}
						}
						.ico{
							position:absolute;
							left:0;
							top:0;
							height:100%;
							i{
								position:absolute;
								width:8px;
								height:8px;
								border-radius:50%;
								background: #d4d4d4;
								display: block;
								left:0;
								margin-left:-4px;
								top:50%;
								margin-top:-4px;
							}
							.active{
								width:22px;
								height:22px;
								position:absolute;
								left:0;
								margin-left:-11px;
								border:1px solid $color;
								transition:transform 0.5s;
								border-radius:50%;
								transform:scale(0);
								span{
									width:12px;
									height:12px;
									border-radius:50%;
									background:$color;
									position:absolute;
									left:50%;
									margin-left:-6px;
									top:50%;
									margin-top:-6px;
								}
							}
						}
					}
				}
			}
			.content{
				width:86.1%;
				float:right;
				@media(max-width:1024px){
					width:100%;
					float:none;
				}
				ul{
					.li{
						margin-top:54px;
						@media(max-width:1024px){
							margin-top:40px;
						}
						@media(max-width:600px){
							margin-top:20px;
						}
						&:first-child{
							margin-top:0;
						}
						.box_top{
							width:100%;
							height:160px;
							padding:0 40px;
							box-sizing:border-box;
							@media(max-width:1300px){
								padding:0 30px;
							}
							@media(max-width:1024px){
								height:120px;
							}
							@media(max-width:800px){
								padding:0 15px;
							}
							@media(max-width:600px){
								height: 70px;
							}
							.tab{
								width:100%;
								height:100%;
								display:table;
								.tab_cell{
									display: table-cell;
									vertical-align: middle;
									@include fz(24px,36px);
									color:#fff;
									font-weight:bold;
									span{
										@include fz(16px,16px);
										color:#fff;
										font-family: "AVANTGARDEITCBYBT-DEMI";
										text-transform:uppercase;
									}
									@media(max-width:1024px){
										@include fz(20px,30px);
									}
									@media(max-width:600px){
										@include fz(18px,30px);
										span{
											@include fz(13px,13px);
										}
									}
								}
							}
						}
						.list{
							ul{
								margin-top:15px;
								width:110%;
								@media(max-width:800px){
									width:100%;
								}
								li{
									float:left;
									width:30.1%;
									background: #fff;
									margin-right:5px;
									margin-top:5px;
									padding:28px 16px 28px 40px;
									transition:background 0.5s,box-shadow 0.5s;
									box-sizing:border-box;
									@media(max-width:1400px){
										padding:20px 16px 20px 30px;
									}
									@media(max-width:1300px){
										width:30%;
									}
									@media(max-width:800px){
										width:49%;
										margin-right:0;
										margin-top:2%;
										padding:15px;
										&:nth-child(even){
											float: right;
										}
									}
									@media(max-width:500px){
										width:100%;
										float:none !important;
										margin-top:5px;
										height: auto !important; 
									}
									@media(min-width:1024px){
										&:hover{
											background:$color;
											box-shadow:0px 0px 10px 10px rgba(#ededed,0.5);
											.tab{
												.tab_cell{
													.year{
														color:#fff;
														span{
															color:#fff;
														}
													}
													.line{
														background: #fff;
													}
													.txt{
														color:#fff;
													}
												}
											}
										}
									}
									.tab{
										width:100%;
										height:100%;
										display:table;
										.tab_cell{
											display: table-cell;
											vertical-align: middle;
											.year{
												@include fz(32px,36px);
												color:$color;
												transition:color 0.5s;
												font-family: "AVANTGARDEITCBYBT-DEMI";
												span{
													@include fz(16px,18px);
													transition:color 0.5s;
													color:$color;
													display: inline-block;
													vertical-align: 2px;
													font-family:"Microsoft Yahei";
													margin-left:4px;
												}
												@media(max-width:1200px){
													@include fz(28px,32px);
													span{
														@include fz(14px,16px);
													}
												}
												@media(max-width:1024px){
													@include fz(24px,30px);
												}
											}
											.line{
												width:30px;
												height:4px;
												margin-bottom:17px;
												background:$color;transition:color 0.5s;
												@media(max-width:1024px){
													margin-bottom:10px;
												}
												@media(max-width:600px){
													width:24px;
													height: 2px;
													margin-bottom:6px;
												}
											}
											.txt{
												@include fz(16px,28px);
												color:#333;transition:color 0.5s;
												@media(max-width:1024px){
													@include fz(14px,24px);
													margin-top:3px;
												}
											}	
										}
									}
								}
							}
						}
					}
				}
			}
		}
	}
	.join_b{
		margin-left:auto;
		margin-right:auto;
		overflow: hidden;
		.jm{
			margin-top:70px;
			padding-bottom:90px;
			@media(max-width:1024px){
				padding-bottom:70px;
				margin-top:50px;
			}
			@media(max-width:600px){
				margin-top:30px;
				padding-bottom:40px;
			}
			.group{
				width:100%;
				height:auto;
				// padding-top:20px;
				.input-group{
					width:33.3%;
					float:left;
					margin-bottom:8px;
					select{
						background:none; 
					}
					&.file{
						height:60px;
						input{
							position: relative;
							top: 5px;
							font-size:14px;
							color:#333; 
						}   
					}
					&.resume{
						float:none;
						clear:both;
						.text{
							width:296%;
							resize:none;
							height: 150px;
							background:none;
							border:1px solid #ccc;
						}	    
					}
					label{
						font-size: 14px;
						line-height: 26px;
						display:block;
						color:#333;
					}
					.text{
					    width: 96%;
					    height: 34px;
					    line-height: 34px;
					    border: 1px solid #ccc;
					    text-indent: 1em;
					    color: #333;;
					    box-sizing:border-box;
					}
					input.text{
						height:32px;
						line-height:32px; 
						background:none;
						font-size:14px; 
					}
				} 
				@media(max-width:1240px){
					.input-group{
						&.resume{
							float:none;
							clear:both;
							.text{
								width:292%;
								resize:none;
								height: 180px;
								background:none;
							}	    
						}
						label{
							font-size: 14px;
							line-height: 26px;
							display:block;
						}
						.text{
						    width: 92%;
						    height: 34px;
						    line-height: 34px;

						    box-sizing:border-box;
						}
						input.text{
							height:32px;
							line-height:32px; 
							background:none;
							font-size:14px; 
						}
					} 
				}
				@media(max-width:1024px){
					// padding-top:30px; 
					.input-group{
						width:100%;
						margin-bottom:10px; 
						float:none;
						.text{
							width:100%;
							height:30px;
							line-height:30px; 
						}
						&.resume{
								.text{
									width:100%;
									resize:none;
									height: 100px;
								}
								    
							}
						}
					}
				}
				
			.btn-box{
				padding-bottom: 10px;
				.btn{
				    width: 152px;
				    text-align: center;
				    height: 40px;
				    line-height: 40px;
				    border-radius: 40px;
				    font-size: 16px;
				    color: #fff;
				   	border:1px solid $color;
				    background:$color; 
				    clear:both;
				}
				@media(max-width:1240px){
					width:90%;
					.btn{
						width:120px;
						height:35px;
						line-height:35px;
						font-size:14px;  
					}
				}
				@media(max-width:1024px){
					width:90%;
					.btn{
						width:100px;
						height:30px;
						line-height:30px;
						font-size:14px;  
					}
				}
			}
		}
		.position{
			margin:23px 0;
			@include fz(14px,22px);
			color:#666;
			padding-left:28px;
			background:url(../img/position.jpg) no-repeat left center;
			a{
				color:#666;
				@media(min-width:1024px){
					&:hover{
						color:$color;
					}
				}
			}
			@media(max-width:1024px){
				display: none;
			}
		}
		.form_top{
			@media(max-width:1024px){
				margin-top:30px;
			}
			@media(max-width:650px){
				margin-top:10px;
			}
			.submit{
				width:12.7%;
				height: 46px;
				background:url(../img/ss.png) no-repeat center center #0079c3;
				border:1px solid #e8e8e8;
				box-sizing:border-box;
				text-indent:2000px;
				@media(max-width:650px){
					width:48%;
					margin-left:4%;
					margin-top:4%;
					height: 40px;	
				}
			}
			.text{
				width:27.3%;
				height: 46px;
				border:1px solid #e8e8e8;
				box-sizing:border-box;
				margin-right:1.8%;
				float:left;
				@include fz(14px,46px);
				color:#999;
				padding:0 20px;
				box-sizing:border-box;
				@media(max-width:650px){
					width:48%;
					height: 40px;	
					line-height:40px;
					margin-right:0;
					margin-top:4%;
				}
			}
			select{
				background: #fff;
				width:27.3%;
				height: 46px;
				border:1px solid #e8e8e8;
				box-sizing:border-box;
				margin-right:1.8%;
				float:left;
				@include fz(14px,46px);
				color:#999;
				padding:0 20px;
				box-sizing:border-box;
				@media(max-width:650px){
					width:48%;
					margin-left: 4%;
					margin-top:4%;
					height: 40px;	
					line-height:40px;
					margin-right:0;
				}
			}
		}
		.jbox{
			margin-top:30px;
			padding-bottom:100px;
			@media(max-width:1024px){
				margin-top: 0;
				padding-bottom:60px;
			}
			@media(max-width:600px){
				padding-bottom:30px;
			}
			.join{
				padding:0 7.9%;
				background:#0079c3;
				@media(max-width:600px){
					margin-top:18px;
				}
				.join_cen{
					ul{
						li{
							float:left;
							width:20%;
							@include fz(16px,48px);
							color:#fff;
							font-weight:bold;
							text-align: center;
							&:first-child{
								text-align: left;
							}
						}
					}
				}
				@media(max-width:1024px){
					padding:0 20px;
					.join_cen{
						ul{
							li{
								@include fz(14px,40px);
							}
						}
					}
				}
				@media(max-width:650px){
					padding:0 15px;
					.join_cen{
						ul{
							li{
								@include fz(13px,40px);
								width:25%;
							}
							li:last-child{
								display: none;
							}
							li:nth-child(1){
								width:34%;
							}
							li:nth-child(3){
								width:16%;
							}
						}
					}
				}
			}
			.join_main{
				ul{
					li{
						&.active{
							.ti{
								background: #f9f9f9;
							}
						}
						.ti{
							padding:0 7.9%;
							background: #fff;
							cursor:pointer;
							border-bottom:1px solid #ededed;
							.ti_cen{
								height: 48px;
								.txt{
									float:left;
									width:20%;
									@include fz(16px,24px);
									color:#666;
									text-align: center;
									height: 100%;
								}
								.tab{
									width:100%;
									height:100%;
									display:table;
									.tab_cell{
										display: table-cell;
										vertical-align: middle;
									}
								}
								.txt:first-child{
									text-align:left;
								}
							}
						}
						.content{
							padding:0 7.9%;
							display: none;
							background: #f9f9f9;
							border-bottom:1px solid #ededed;
							&.show{
								display: block;
							}
							.content_cen{
								padding:15px 0;
								.cont{
									@include fz(14px,28px);
									color:#666;
								}
								.apply{
									width:110px;
									margin-bottom:8px;
									height:34px;
									@include fz(16px,34px);
									color:#fff;
									display: block;
									background:#50a418;	
									text-align: center;
									margin-top:15px;
								}
							}
						}
					}
				}
				@media(max-width:1024px){
					ul{
						li{
							.ti{
								padding:0 20px;
								.ti_cen{
									height: 40px;
									.txt{
										font-size:14px;
									}
								}
							}
							.content{
								padding:0 20px;
								.content_cen{
									.cont{
										.tit{
											padding-top:15px;
										}
										.con{
											line-height:24px;
										}
									}
								}
							}
						}
					}
					
				}
				@media(max-width:650px){
					ul{
						li{
							.ti{
								padding:0 15px;
								.ti_cen{
									.txt{
										@include fz(13px,18px);
										width:25%;
										
									}
									.txt:last-child{
										display: none;
									}
									.txt:nth-child(1){
										width:34%;
									}
									.txt:nth-child(3){
										width:16%;
									}
									
								}
							}
							.content{
								padding:0 15px;
								.content_cen{
									.cont{
										.tit{
											padding-top:10px;
										}
										.con{
											font-size:13px;
											margin-bottom:0;
										}
										.apply{
											margin-top:15px;
											font-size:14px;
											width: 90px;
										}	
									}
									
								}
								
							}
						}
					}
				}
			}
		}
	}
	.welcome{
		overflow: hidden;
		padding-bottom:80px;
		@media(max-width: 1024px){
			padding-bottom:30px;
		}
		.banner{
			.flexslider{
				// min-height:calc(100% * 0.5453);
				position: relative;
				z-index: 1;
				height: 806px;
				// width: 1800px;
				width: 94.081%;
				@media(min-width:1024px) and (max-height:900px){
					height: 750px;
				}
				@media(min-width:1024px) and (max-height:800px){
					height: 650px;
				}
				@media(min-width:1024px) and (max-height:750px){
					height: 600px;
				}
				@media(max-width: 1024px){
					background: none !important;
					height: auto;
					width: 100%;
				}
				.slides{
					height: 806px;
					@media(min-width:1024px) and (max-height:900px){
						height: 750px;
					}
					@media(min-width:1024px) and (max-height:800px){
						height: 650px;
					}
					@media(min-width:1024px) and (max-height:750px){
						height: 600px;
					}
					@media(max-width: 1024px){
						background: none !important;
						height: auto;
					}
					li{
						height: 806px;
						overflow: hidden;
						@media(min-width:1024px) and (max-height:900px){
							height: 750px;
						}
						@media(min-width:1024px) and (max-height:800px){
							height: 650px;
						}
						@media(min-width:1024px) and (max-height:750px){
							height: 600px;
						}
						@media(max-width: 1024px){
							background: none !important;
							height: auto;
						}
						a{
							position: relative;
							width: 100%;
							display: block;
							height: 806px;
							@media(min-width:1024px) and (max-height:900px){
								height: 750px;
							}
							@media(min-width:1024px) and (max-height:800px){
								height: 650px;
							}
							@media(min-width:1024px) and (max-height:750px){
								height: 600px;
							}
							@media(max-width: 1024px){
								height: auto;
							}
							img{
								display: none;
								width: 100%;
								@media(max-width: 1024px){
									display: block;
									width: 140%;
									margin-left: -20%;
								}
								
							}
							// .w1200{
							// 	overflow: hidden;
							// 	position: absolute;
							// 	left:50%;
							// 	top:0;
							// 	margin-left: -600px;
							// 	z-index: 2;
							// 	height: 100%;
								
							// 	@media(max-width: 1220px){
							// 		margin-left: -45%;
							// 	}
							// 	@media(max-width: 1024px){
							// 		margin-left: -45%;
							// 		width: 90%;
							// 	}
							// 	.li_con{
									
							// 		// display: table;
							// 		width: 100%;
							// 		margin-top: 170px;
							// 		@media(max-width: 850px){
							// 			margin-top: 120px;
							// 		}
							// 		@media(max-width: 640px){
							// 			margin-top: 1rem;
							// 		}
							// 		@media(max-width: 480px){
							// 			margin-top: 0.6rem;
							// 		}
							// 		.table{
							// 			// display: table-cell;
							// 			// vertical-align: middle;
							// 		}
							// 		h5{
							// 			font-size: 66px;
							// 			font-family: 'Arial';
							// 			line-height: 68px;
							// 			color: #ffffff;
							// 			text-transform: uppercase;
							// 			@media(max-width: 1024px){
							// 				font-size: 0.6rem;
							// 				line-height: 0.62rem;
							// 			}
							// 			@media(max-width: 640px){
							// 				font-size: 0.3rem;
							// 				line-height: 0.32rem;
							// 			}
							// 		}
							// 		h4{
							// 			font-size:68px;
							// 			line-height: 82px;
							// 			color: #fff;
							// 			@media(max-width: 1024px){
							// 				font-size: 0.62rem;
							// 				line-height: 0.76rem;
							// 			}
							// 			@media(max-width: 640px){
							// 				font-size: 0.32rem;
							// 				line-height: 0.46rem;
							// 			}
							// 		}
							// 		h6{
							// 			font-size: 34px;
							// 			color: #ffffff;
							// 			line-height: 46px;
							// 			margin-top: 14px;
							// 			font-weight: inherit;
							// 			@media(max-width: 1024px){
							// 				font-size: 0.34rem;
							// 				line-height: 0.46rem;
							// 			}
							// 			@media(max-width: 640px){
							// 				font-size: 0.26rem;
							// 				line-height: 0.4rem;
							// 			}
							// 		}
							// 		.txt{
							// 			font-size: 18px;
							// 			color: #fff;
							// 			font-family: 'AVGARDN';
							// 			line-height: 26px;
							// 			text-transform: uppercase;
							// 			@media(max-width: 1024px){
							// 				font-size: 14px;
							// 				line-height: 20px;
							// 			}
							// 		}
							// 	}
							// }
						}
					}
				}
				
				.flex-control-nav{
					// display: none;
					font-size: 0;
					@media(max-width: 1024px){
						display: block;
					}
					li{
						a{
							opacity: 0.5;
							filter:alpha(opacity=50);
						}
						a.flex-active{
							background: #fff;
							opacity: 1;
							filter:alpha(opacity=100);
						}
					}
				}
				.flex-direction-nav{
					position: absolute;
					width: 1200px;
					left: 50%;
					bottom:307px;
					margin-left: -600px;
					display: block;
					z-index: 100;
					overflow: hidden;
					display: none;
					@media(max-width: 1220px){
						margin-left: -45%;
						width: 90%;
					}
					@media(max-width: 1024px){
						bottom:20px;
					}
					@media(max-width: 480px){
						display: none;
					}
					.flex-nav-prev{
						width: 45px;
						height: 45px;
						background: rgba(0,0,0,0.37);
						float: left;
						a{
							display: block;
							height: 45px;
							background: url(../img/slider_prev.png) no-repeat center center;
							font-size: 0;
							opacity: 0.5;
						}
					}

					.flex-nav-next{
						width: 45px;
						height: 45px;
						background: rgba(0,0,0,0.37);
						float: left;
						margin-left: 15px;
						@media(max-width: 1024px){
							float: right;
							margin-left: 0;
						}
						a{
							font-size: 0;
							height: 45px;
							opacity: 0.5;
							display: block;
							background: url(../img/slider_next.png) no-repeat center center;
						}
					}
					@media(min-width:1024px){
						.flex-nav-prev:hover{
							a{
								opacity: 1;
								background-color: #f28e2d;
							}
						}
						.flex-nav-next:hover{
							a{
								opacity: 1;
								background-color: #f28e2d;
							}
						}
					}
				}
			}
		}
		.index_themes{
			margin-top: -46px;
			position: relative;
			z-index: 2;
			@media(max-width: 1024px){
				margin-top: 30px;
				padding:0 0.24rem;
			}
			.w1680{
				width: 88.282%;
				@media(max-width: 1700px){
					width: 88.282%;
				}
				@media(max-width: 1024px){
					width: 100%;
				}
				.themes{
					// width: 1201px;
					width: 71.428%;
					float: left;
					@media(max-width: 1200px){
						width: 100%;
						float: inherit;
					}
					ul{
						overflow: hidden;
						li{
							// width:280px;
							width: 23.33%;
							margin-right: 1.66%;
							float: left;
							@media(max-width: 1200px){
								margin-right: 2.226%;
							}
							@media(max-width: 750px){
								width: 49%;
								margin-right: 2%;
								margin-bottom: 14px;
							}
							@media(max-width: 480px){
								margin-bottom: 8px;
							}
							a{
								display: block;
								background: #fff;
								transition:all 0.5s;
								.pic{
									width: 100%;
									overflow: hidden;
									img{
										width: 100%;
										display: block;
									}
								}
								.text{
									padding:20px 12px 13px;
									
									@media(max-width: 1024px){
										padding:14px 12px 10px;
									}
									@media(max-width: 750px){
										padding:8px 10px 8px;
									}
									.tit{
										font-size: 20px;
										color: #333333;
										line-height: 40px;
										overflow: hidden;
										display: block;
										white-space: nowrap;
										text-overflow: ellipsis;
										@media(max-width: 1024px){
											font-size: 18px;
											line-height: 36px;
										}
										@media(max-width: 750px){
											font-size: 16px;
											line-height: 32px;
										}
									}
									.txt{
										font-size: 14px;
										color: #333333;
										line-height: 24px;
										overflow: hidden;
										display: block;
										height: 48px;
										// white-space: nowrap;
										// text-overflow: ellipsis;
										opacity: 1;
										filter:alpha(opacity=100);
										@media(max-width: 1024px){
											line-height: 20px;
											height: 40px;
										}
									}
								}
							}
							@media(min-width:1024px){
								a:hover{
									background: #c0a986;
									.text{
										
										.tit{
											color: #fff;
										}
										.txt{
											color: #fff;
											opacity: 0.64;
											filter:alpha(opacity=64);
										}
									}
								}
							}
						}
						@media(max-width: 1200px){
							li:last-child{
								margin-right: 0;
							}
						}
						@media(max-width:750px) and (min-width:00px){
							li:nth-child(2n){
								margin-right: 0;
							}
						}
					}
				}
				.index_about{
					// width: 480px;
					width: 28.57%;
					float: right;
					background: #fff;
					margin-top: -118px;
					@media(max-width: 1200px){
						width: 100%;
						float: inherit;
						margin-top: 20px;
					}
					@media(max-width: 1024px){
						margin-top: 10px;
					}
					.padding{
						padding:65px 36px 60px;
						@media(max-width: 1800px){
							padding:55px 26px 50px;
						}
						@media(max-width: 1450px){
							padding:45px 16px 50px;
						}
						@media(max-width: 1300px){
							padding:45px 16px 40px;
						}
						@media(max-width: 750px){
							padding:20px 10px 18px;
						}

						.bocweb-logo{
							width: 155px;
							height: 31px;
							overflow: hidden;
							display: block;
							@media(max-width: 1650px){
								width: 135px;
								height: 27px;
							}
							@media(max-width: 1550px){
								width: 105px;
								height: 21px;
							}
							@media(max-width: 1024px){
								width: 90px;
								height: 18px;
							}
							img{
								width: 100%;
								display: block;
							}
						}
						h4{
							font-size: 30px;
							color: #039e94;
							line-height: 48px;
							margin-top: 12px;
							@media(max-width: 1800px){
								font-size: 28px;
								line-height: 42px;
							}
							@media(max-width: 1650px){
								font-size: 26px;
								line-height: 40px;
							}
							@media(max-width: 1550px){
								font-size: 24px;
								line-height: 38px;
							}
							@media(max-width: 1350px){
								font-size: 20px;
								line-height: 34px;
							}
							@media(max-width: 1024px){
								font-size: 16px;
								line-height: 26px;
							}
							span{
								display: inline-block;
								background: #039e94;
								color: #fff;
							}
						}
						.tit{
							font-size: 30px;
							color: #000033;
							line-height: 64px;
							margin-top: 28px;
							@media(max-width: 1800px){
								font-size: 28px;
								line-height: 60px;
							}
							@media(max-width: 1650px){
								font-size: 26px;
								line-height: 58px;
							}
							@media(max-width: 1550px){
								font-size: 24px;
								line-height: 56px;
							}
							@media(max-width: 1024px){
								font-size: 18px;
								line-height: 46px;
								margin-top: 10px;
							}
							// @media(max-width: 1024px){
							// 	font-size: 16px;
							// 	line-height: 42px;
							// 	margin-top: 10px;
							// }
						}
						.text{
							font-size: 14px;
							color: #666666;
							line-height: 26px;
							overflow: hidden;
							height: 78px;
							@media(max-width: 1024px){
								line-height: 20px;
								height: 60px;
							}
						}
						.more{
							width: 146px;
							height: 38px;
							border:1px solid #e5e5e5;
							border-radius:38px;
							text-align: center;
							font-size: 14px;
							color: #333333;
							margin-top: 39px;
							display: block;
							line-height: 38px;
							text-transform: uppercase;
							font-family: 'Arial';
							transition:all 0.5s;
							@media(max-width: 1024px){
								width: 116px;
								height: 28px;
								margin-top: 16px;
								border-radius:28px;
								line-height: 28px;
							}
						}
						@media(min-width:1024px){
							.more:hover{
								color: #039e94;
								border-color:#039e94;
							}
						}
					}
				}
			}
		}
		.index_usefulness{
			margin-top: 70px;
			@media(max-width: 1024px){
				margin-top: 20px;
			}
			.w1680{
				position: relative;
				.pic{
					.household,.commercial{
						overflow: hidden;
						img{
							width: 100%;
							display: block;
						}
					}
					.commercial{
						display: none;
					}
				}
				.mark{
					width: 100%;
					height: 100%;
					position: absolute;
					left: 0;
					top: 0;
					background: rgba(0,0,0,0.7);
					z-index: 1;
				}
				.tabs{
					// width: 394px;
					width: 23.454%;
					// height: 220px;
					position: absolute;
					left: 50%;
					top: 50%;
					margin-left:-11.726%;
					z-index: 2;
					// background: url(../img/usefulness_bg.png) no-repeat;
					background-size: contain;
					overflow: hidden;
					@media(max-width: 1024px){
						width: 30%;
						margin-left:-15%;
					}
					@media(max-width: 640px){
						width: 50%;
						margin-left:-25%;
					}
					a{
						width: 50%;
						height: 100%;
						text-align: center;
						line-height: 100%;
						display: block;
						float: left;
						font-size: 28px;
						color: #c8a063;
						background: url(../img/household.png) no-repeat;
						background-size: cover;
						box-sizing:border-box;
						
						display: table;
						@media(max-width: 1600px){
							font-size: 24px;
						}
						@media(max-width: 1400px){
							font-size: 20px;
						}
						@media(max-width: 480px){
							font-size: 16px;
						}
						span{
							display: table-cell;
							vertical-align: middle;
						}
					}
					a:last-child{
						margin-left: 0;
					}
					.commer{
						background: url(../img/commercial.png) no-repeat;
						background-size: cover;
					}
					@media(min-width:1024px){
						a:hover{
							transition:all 0.3s;
							background: url(../img/household_h.png) no-repeat;
							background-size: cover;
							color: #e6d8c4;
						}
						.commer:hover{
							background: url(../img/commercial_h.png) no-repeat;
							background-size: cover;
						}
					}
					.house.active{
						background: url(../img/household_h.png) no-repeat;
						background-size: cover;
						color: #e6d8c4;
					}
					.commer.active{
						background: url(../img/commercial_h.png) no-repeat;
						background-size: cover;
						color: #e6d8c4;
					}
				}
			}
		}
		.index_news{
			margin-top: 69px;
			@media(max-width: 1024px){
				margin-top: 20px;
				padding:0 0.24rem;
			}
			.w1680{
				.tit{
					font-size: 36px;
					color: #009e96;
					line-height: 68px;
					@media(max-width: 1024px){
						font-size: 30px;
						line-height: 56px;
					}
					@media(max-width: 750px){
						font-size: 24px;
						line-height: 44px;
					}
					@media(max-width: 480px){
						font-size: 20px;
						line-height: 36px;
					}

				}
				.line{
					width: 48px;
					height: 2px;
					background: #009e96;
					@media(max-width:600px){
						width:30px;
						margin-top:5px;
						margin-bottom:20px;
					}
				}
				.con{
					margin-top: 34px;
					overflow: hidden;
					@media(max-width:1024px){
						margin-top: 14px;
					}
					.left{
						// width: 1050px;
						width: 62.5%;
						float: left;
						@media(max-width:750px){
							width: 100%;
							float: inherit;
						}
						.swiper_news{
							display: none;
							@media(max-width:500px){
								display: block;
							}
							.swiper-container{
								.swiper-pagination{
									position:static;
									margin-top:10px;
									span{
										width:8px;
										height:8px;
										border-radius:50%;
										&.swiper-pagination-bullet-active{
											background: $color;
										}
									}
								}
								.swiper-wrapper{
									.swiper-slide{
										background: #fff;
										a{
											display: block;
											.pic{
												overflow: hidden;
												img{
													width:100%;
													transition:all 0.5s ease-in-out;
													height: auto;
												}
											}
											.cont{
												padding:20px 15px;
												.t{
													@include fz(20px,36px);
													color:#333;
													@extend .ellipsis;
													@media(max-width:1024px){
														@include fz(18px,28px);
													}
													@media(max-width:600px){
														@include fz(16px,24px);
													}
												}
												.con{
													@include fz(14px,24px);
													color:#666;
													overflow: hidden;
													height: 48px;
													margin-top: 8px;
												}
												.time{
													@include fz(14px,26px);
													color:#bebdbd;
													margin-top:8px;
												}
											}
										}
									}
								}
							}
						}
						ul{
							overflow: hidden;
							@media(max-width:500px){
								display: none;
							}
							li{
								// width: 508px;
								width: 48.38%;
								float: left;
								margin-right: 3.14%;
								@media(max-width:750px){
									width: 49%;
									margin-right: 2%;
								}
								a{
									display: block;
									.pic{
										width: 100%;
										overflow: hidden;
										img{
											width: 100%;
											display: block;
											transition:all 0.5s;
										}
									}
									.text{
										background: #fff;
										padding:20px 37px 24px;
										@media(max-width: 1600px){
											padding:20px 27px 24px;
										}
										@media(max-width: 1200px){
											padding:20px 17px 24px;
										}
										@media(max-width:640px){
											padding:14px 10px 14px;
										}
										.tits{
											font-size: 20px;
											color: #333333;
											line-height: 42px;
											display: block;
											overflow: hidden;
											white-space: nowrap;
											text-overflow: ellipsis;
											transition:all 0.5s;
											@media(max-width: 1024px){
												font-size: 18px;
												line-height: 38px;
											}
											@media(max-width:640px){
												font-size: 16px;
												line-height: 34px;
											}
										}
										.txt{
											font-size:14px;
											color: #666666;
											line-height: 24px;
											overflow: hidden;
											display: block;
											height: 48px;
											@media(max-width:640px){
												line-height: 20px;
												height: 40px;
											}
										}
										.time{
											font-size: 14px;
											color: #999999;
											line-height: 24px;
											margin-top: 14px;
											@media(max-width:640px){
												margin-top: 8px;
											}
										}
									}
								}
								@media(min-width:1024px){
									a:hover{
										.pic{
											img{
												transform:scale(1.05);
											}
										}
										.text{
											.tits{
												color: #c0a986;
											}
										}
									}
								}
							}
							li:last-child{
								margin-right: 0;
							}
							@media(max-width: 750px){
								li:last-child{
									margin-right: 0;
								}
							}
						}
					}
					.right{
						width: 33.333%;
						overflow: hidden;
						float: right;
						@media(max-width:750px){
							width: 100%;
							float: inherit;
							background: none !important;
							margin-top: 10px;
						}
						img{
							width: 100%;
							display: none;
							@media(max-width:750px){
								display: block;
							}
						}
					}
				}
			}
		}
	}
	.about{
		.intro{
			padding-top:110px;
			padding-bottom:70px;
			position:relative;
			@media(max-width:1024px){
				padding-top:70px;
			}
			@media(max-width:750px){
				padding:40px 0;
			}
			@media(max-width:600px){
				padding:30px 0;
			}
			.cloumn{
				position:absolute;
				left:0;
				top:0;
				@media(max-width:1024px){
					display: none;
				}
				.line{
					width:1px;
					height:165px;
					background: #ddd;
					position:relative;
					margin:0 auto;
					&::after{
						content:'';
						width:3px;
						height:26px;
						position:absolute;
						display: block;
						background: #c8a063;
						left:50%;
						margin-left:-1.5px;
						bottom:0;
					}

				}
				.txt{
					margin-top:20px;
					.cn{
						@include fz(24px,24px);
						color:#333;
						width:24px;
						display: inline-block;
						vertical-align: top;
					}
					.img{
						display: inline-block;
						vertical-align: top;
						width:14px;
						img{
							width:100%;
							height: auto;
						}
					}
				}
			}
			.line_bot{
				width:1px;
				height:100px;
				position:absolute;
				right:0;
				bottom:0;
				background: #ddd;
				&::after{
					content:'';
					width:3px;
					height:26px;
					position:absolute;
					display: block;
					background: #c8a063;
					left:50%;
					margin-left:-1.5px;
					top:0;
				}
				@media(max-width:1024px){
					height:60px;
				}
			}
			.txt_box{
				// width:1200px;
				width:86.1%;
				padding-right:1.4%;
				box-sizing:border-box;
				margin-left:auto;
				margin-right:auto;
				@media(max-width:1024px){
					width:100%;
					padding-right:0;
				}
				.txt_l{
					float:left;
					width:52%;
					@media(max-width:1200px){
						width:55%;
					}
					@media(max-width:1024px){
						width:100%;
						float:none;
					}
					.logo{
						img{
							max-width:80%;
						}
					}
					.t{
						@include fz(16px,26px);
						color:#666;
						margin-top:30px;
						@media(max-width:850px){
							margin-top:15px;
						}
					}
					.con{
						@include fz(14px,24px);
						color:#888;
						p{
							padding-top:25px;
						}
						@media(max-width:1300px){
							p{
								padding-top:15px;
							}
						}
						@media(max-width:850px){
							p{
								padding-top:10px;
							}
						}
					}
				}
				.pic{
					float:right;
					width:35.7%;
					position:relative;
					margin-top:2%;
					@media(max-width:1300px){
						width:40%;
						margin-top:3%;
					}
					@media(max-width:650px){
						width:60%;
						margin-top:15px;
					}
					@media(max-width:1024px){
						float:none;
					}
					.tu{
						width:100%;
						height:100%;
						overflow: hidden;
						img{
							width:100%;
							height: auto;
							border-radius:50%;
						}
					}
					.bg{
						position:absolute;
						width:106.6%;
						height:103.6%;
						right:-3.2%;
						top:-3%;
						background:url(../img/bg2.png) no-repeat center center;
						background-size:cover;
					}
					
				}
			}
		}
		.text_box{
			background: #fff;
			padding-top:68px;
			padding-bottom:40px;
			@media(max-width:700px){
				padding:35px 0;
			}
			.text_box_cen{
				.text_b{
					width:86.1%;
					margin-left:auto;
					margin-right:auto;
					@media(max-width:1024px){
						width:100%;
					}
					.icon{
						img{
							@media(max-width:600px){
								height:20px;
							}
						}
					}
					.con{
						margin-top:5px;
						@include fz(14px,24px);
						color:#888;
						p{
							padding-top:22px;
							@media(max-width:1024px){
								padding-top:15px;
							}
							@media(max-width:800px){
								padding-top:10px;
							}
						}
					}
					.ds{
						margin-top:45px;
						position:relative;
						@media(max-width:1024px){
							margin-top:30px;
						}
						.pic{
							width:43%;
							img{
								max-width:100%;
							}
							@media(max-width:850px){
								width:100%;
							}
						}
						.txt{
							position:absolute;
							right:0;
							top:0;
							width:100%;
							text-align:right;
							 @media(max-width:850px){
								position:static;
								margin-top:20px;
							}
							@media(max-width:600px){
								text-align: left;
							}
							.inline{
								position:relative;
								display: inline-block;
								padding-left:40px;
								@media(max-width:600px){
									padding-left:30px;
								}
								.line{
									width:35px;
									height:2px;
									background:$color;
									position:absolute;
									left:0;
									top:9px;
									@media(max-width:600px){
										width:25px;
									}
								}
								.text{
									@include fz(16px,20px);
									color:#c8a063;
									display: inline-block;
									font-weight:bold;
									@media(max-width:1024px){
										font-size:15px;
									}
								}
							}
							
							// @include fz(16px,20px);
							// color:#c8a063;
							// font-weight:bold;
							// @media(max-width:1024px){
							// 	font-size:15px;
							// }
							// @media(max-width:850px){
							// 	position:static;
							// 	margin-top:15px;
							// }
						}
					}
				}
			}
		}
		.link_box{
			padding:143px 0;
			position:relative;
			@media(max-width:1400px){
				padding:120px 0;
			}
			@media(max-width:1024px){
				padding:80px 0;
			}
			@media(max-width:600px){
				padding:35px 0;
			}
			.border{
				position:absolute;
				top:10px;
				right:10px;
				bottom:10px;
				left:10px;
				border:1px solid  #95b5dd;
				box-sizing:border-box;
			}
			.link_box_cen{
				position:relative;
				z-index:10;
				ul{
					li{
						height:220px;
						width:33.33%;
						float:left;
						text-align: center;
						padding:52px 10px 0 10px;
						box-sizing:border-box;
						background: rgba(#000,0.05);
						position:relative;
						&:nth-child(3),&:nth-child(5){
							background: rgba(#fff,0.05);
						}
						&:nth-child(1){
							background: #c8a063;
						}
						@media(max-width:1300px){
							height:180px;
							padding:35px 10px 0 10px;
						}
						@media(max-width:1024px){
							height: 140px;
							padding:25px 10px 0 10px;
						}

						@media(max-width:650px){
							width:50%;
							height:130px;
							&:nth-child(3),&:nth-child(5){
								background: rgba(#000,0.05);
							}
							&:nth-child(4),&:nth-child(5){
								background: rgba(#fff,0.05);
							}
						}
						@media(max-width:500px){
							height:100px;
							padding:15px 5px 0 5px;
						}
						@media(min-width:1024px){
							&:hover{
								.bg{
									transform-origin:top center;
									transform:scaleY(1);
								}
							}
						}
						.img{
							img{
								max-width:80%;
							}
						}
						a{
							position:relative;
							z-index:10;
						}
						.bg{
							position:absolute;
							left:0;
							top:0;
							right:0;
							bottom:0;
							background: #c8a063;
							transform-origin:bottom center;
							transform:scaleY(0);
							transition:transform 0.5s ease-in-out;
						}
						.btn{
							width:154px;
							height:40px;
							border:1px solid #fff;
							border-radius:20px;
							@include fz(18px,40px);
							color:#fff;
							text-align: center;
							margin-top:30px;
							margin-left:auto;
							margin-right:auto;
							@media(max-width:1024px){
								@include fz(16px,32px);
								height: 32px;
								border-radius:16px;
								width:120px;
								margin-top:20px;
							}
							@media(max-width:500px){
								width:80px;
								height: 28px;
								line-height:28px;
								font-size:14px;
								margin-top:10px;
							}
						}
						.tit{
							.cn{
								@include fz(28px,38px);
								color:#fff;
								@media(max-width:1300px){
									@include fz(24px,32px);
								}
								@media(max-width:1024px){
									@include fz(20px,30px);
								}
								@media(max-width:500px){
									@include fz(18px,24px);
								}
							}
							.en{
								@include fz(16px,26px);
								color:#fff;
								font-family: "Roboto";
								text-transform:uppercase;
								@media(max-width:1300px){
									@include fz(14px,20px);
								}
								@media(max-width:500px){
									@include fz(12px,18px);
								}
							}
						}
						.icon{
							margin-top:23px;
							@media(max-width:1300px){
								margin-top:15px;
								img{
									height: 30px;
								}
							}
							@media(max-width:650px){
								margin-top:10px;
								img{
									height: 24px;
								}
							}
							@media(max-width:500px){
								margin-top:6px;
								img{
									height:20px;
								}
							}
						}
					}
				}
			}
		}
		.company{
			.company_cen{
				padding-bottom:100px;
				@meida(max-width:1024px){
					padding-bottom:80px;
				}
				@media(max-width:600px){
					padding-bottom:35px;
				}
				.swiper_num{
					position:relative;
					display: none;
					padding-top:30px;
					padding-bottom:30px;  
					@media(max-width:800px){
						display: block;
					}
					.prev{
						width:19px;
						height:34px;
						position:absolute;
						left:0;
						top:50%;
						margin-top:-17px;
						background:url(../img/pll.png) no-repeat; 
						@media(max-width:600px){
							width:13px;
							height:24px;
							background-size:cover;
							margin-top:-12px; 
						}
					}
					.next{
						width:19px;
						height:34px;
						position:absolute;
						right:0;
						top:50%;
						margin-top:-17px;
						background:url(../img/prr.png) no-repeat;
						@media(max-width:600px){
							width:13px;
							height:24px;
							background-size:cover;
							margin-top:-12px; 
						} 
					}
					.swiper-container{
						width:90%;
						.swiper-wrapper{
							.swiper-slide{
								.num{
									text-align: center;
									.roll{
										display: inline-block;
										@include fz(60px,58px);
										color:#c8a063;
										font-family: "AVANTGARDEITCBYBT-DEMI";
										@media(max-width:1400px){
											@include fz(50px,50px);
										}
										@media(max-width:1200px){
											@include fz(44px,44px);
										}
										@media(max-width:700px){
											@include fz(32px,32px);
										}
									}
									span{
										display: inline-block;
										vertical-align: 3px;
										@include fz(20px,20px);
										color:#c8a063;
										font-weight: bold;
										@media(max-width:1400px){
											@include fz(16px,16px);
										}
										@media(max-width:700px){
											@include fz(14px,14px);
										}
									}
									img{
										display: inline-block;
										vertical-align: 3px;
										@media(max-width:1400px){
											height: 20px;
										}
										@media(max-width:1200px){
											height: 16px;
										}
										@media(max-width:700px){
											height: 12px;
										}
									}
								}
								.txt{
									@include fz(14px,32px);
									color:#777;
									text-align: center;
									@media(max-width:1200px){
										@include fz(14px,24px);
									}
								}
							}
						}
					}
				}
				.num_list{
					padding-top:63px;
					padding-bottom:53px;
					@media(max-width:1024px){
						padding:30px 0;
					}
					@media(max-width:800px){
						display: none;
					}
					@media(max-width:600px){
						padding:15px 0;
					}
					ul{
						text-align: center;
						@media(max-width:1024px){
							font-size:0;
						}
						li{
							width:20%;
							float:left;
							position:relative;
							padding:0 5px;
							box-sizing:border-box;
							&:last-child{
								&::after{
									display: none;
								}
							}
							&::after{
								content:'';
								display: block;
								position:absolute;
								width:12px;
								height:20px;
								background:url(../img/xl.png) no-repeat right center;
								right:0;
								top:50%;
								margin-top:-10px;
							}
							@media(max-width:1024px){
								&::after{
									display: none;
								}
								margin:10px 0;
								width:33.33%;
								display: inline-block;
								float:none;
								vertical-align: top;
							}
							@media(max-width:700px){
								width:50%;
							}
							.num{
								text-align: center;
								.roll{
									display: inline-block;
									@include fz(60px,58px);
									color:#c8a063;
									font-family: "AVANTGARDEITCBYBT-DEMI";
									@media(max-width:1400px){
										@include fz(50px,50px);
									}
									@media(max-width:1200px){
										@include fz(44px,44px);
									}
									@media(max-width:700px){
										@include fz(30px,30px);
									}
								}
								span{
									display: inline-block;
									vertical-align: 3px;
									@include fz(20px,20px);
									color:#c8a063;
									font-weight: bold;
									@media(max-width:1400px){
										@include fz(16px,16px);
									}
									@media(max-width:700px){
										@include fz(14px,14px);
									}
								}
								img{
									display: inline-block;
									vertical-align: 3px;
									@media(max-width:1400px){
										height: 20px;
									}
									@media(max-width:1200px){
										height: 16px;
									}
									@media(max-width:700px){
										height: 12px;
									}
								}
							}
							.txt{
								@include fz(14px,32px);
								color:#777;
								text-align: center;
								@media(max-width:1200px){
									@include fz(14px,24px);
								}
								@media(max-width:700px){
									@include fz(13px,20px);
								}
							}
						}
					}
				}
				.pic{
					overflow: hidden;
					img{
						width:100%;
						height: auto;
					}
				}
			}
		}
	}
	.contact{
		padding-top:95px;
		padding-bottom:145px;
		@media(max-width:1024px){
			padding-top:70px;
			padding-bottom:110px;
		}
		@media(max-width:800px){
			padding-bottom:70px;
		}
		@media(max-width:600px){
			padding-top:25px;
			padding-bottom:35px;
		}
		.classification{
			@media(max-width:1024px){
				display: block;
				a{
					.arrow{
						display: none;
					}
				}
			}

			@media(max-width:800px){
				a{
					width:140px;
					height:40px;
					line-height:40px;
				}
			}
			@media(max-width:600px){
				margin-top:15px;
				a{
					width:100px;
					height:36px;
					line-height:36px;
					font-size:14px;
				}
			}
		}
		.title{
			.cn{
				color:#333;
			}
			.en{
				color:#999;
			}
		}
		.join_box{
			margin-top:70px;
			position:relative;
			@media(max-width:1200px){
				margin-top:50px;
			}
			@media(max-width:600px){
				margin-top:20px;
			}
			.jr{
				position:absolute;
				right:0;
				top:0;
				height:100%;
				float:right;
				border: 1px solid #e7e7e7;
				background-color: #fff;
				box-shadow: 0 0 6px rgba(7,0,2,.12);
				margin-left:510px;
				padding:0 4.1%;
				box-sizing:border-box;
				@media(max-width:1460px){
					margin-left:480px;
				}
				@media(max-width:1200px){
					margin-left:430px;
				}
				@media(max-width:1024px){
					display: none;
				}
				.job_top{
					padding-top:40px;
					border-bottom:1px solid #d2d2d2;
					padding-bottom:33px;
					@media(max-width:1200px){
						padding-top:30px;
						padding-bottom:20px;
					}
					.job_ds{
						padding-right:160px;
						position:relative;
						@media(max-width:1200px){
							padding-right:0;
						}
						.name{
							@include fz(24px,40px);
							color:#333;
							@media(max-width:1400px){
								@include fz(20px,36px);
							}
						}
						.time{
							@include fz(14px,26px);
							color:#666;
							position:absolute;
							right:0;
							bottom:0;
							@media(max-width:1200px){
								position:static;
								width:100%;
								margin-top:10px;
							}
						}
					}
					.msg{
						margin-top:25px;
						span{
							display: inline-block;
							border:1px solid #cecece;
							padding:0 22px;
							border-radius:20px;
							@include fz(14px,40px);
							color:#666;
							box-sizing:border-box;
							margin:11px 11px 11px 0;
						}
						@media(max-width:1400px){
							margin-top:15px;
						}
						@media(max-width:1200px){
							span{
								padding:0 15px;
								margin:8px 8px 8px 0;
							}
							
						}
					}
				}
				.cont{
					padding-top:30px;
					.t{
						@include fz(18px,26px);
						color:#666;
						font-weight:bold;
						@media(max-width:1400px){
							@include fz(16px,24px);
						}
					}
					.con{
						@include fz(14px,30px);
						color:#666;
						padding-bottom:26px;
					}
					.apply{
						width:234px;
						height:64px;
						background:$color;
						@include fz(18px,64px);
						color:#fff;
						text-align: center;
						display: block;
						margin-top:20px;
						@media(max-width:1400px){
							width:200px;
							height:50px;
							line-height:50px;
						}
					}
				}
			}
			.join_l{
				width:490px;
				// width:34%;
				float:left;
				background: #fff;
				padding-top:20px;
				border: 1px solid #e7e7e7;
				box-shadow: 0 0 6px rgba(7,0,2,.12);
				@media(max-width:1024px){
					box-shadow:none;
					background:none;
				}
				.page_box{
					padding:50px 0;
					@media(max-width:1200px){
						padding:40px 0;
						a{
							&.prev{
								margin-right:15px;
							}
							&.next{
								margin-left:15px;
							}
						}
					}
					@media(max-width:768px){
						padding:30px 0;
					}
					@media(max-width:500px){
						padding:25px 0 0 0;
					}
				}

				@media(max-width:1460px){
					width:440px;
				}
				@media(max-width:1200px){
					width:400px;
				}
				@media(max-width:1024px){
					height: auto !important;
					width:100%;
					border:none;
					padding-top:0;
				}
				ul{
					li{
						transition:background 0.3s;
						padding:0 42px;
						border-bottom:1px solid #ececec;
						@media(min-width:1024px){
							&:hover{
								background: #717171;
								.tit{
									
									.txt{
										color:#fff;
										background:url(../img/sl2.png) no-repeat left center;
									}
								}
							}
						}
						&.active{
							background: #717171;
							.tit{
								.txt{
									color:#fff;
									background:url(../img/sl2.png) no-repeat left center;
									@media(max-width:1024px){
										background:url(../img/sl2.png) no-repeat left 10px;
									}
									@media(max-width:600px){
										background:url(../img/sl2.png) no-repeat left 6px;
									}
								}
								.ico{
									background:url(../img/jian.png) no-repeat right center;
								}
							}
						}
						@media(max-width:1460px){
							padding:0 30px;
						}
						@media(max-width:1024px){
							box-shadow: 0 0 6px rgba(7,0,2,.12);
							margin-top:20px;
							background: #fff;
							padding:0;
							transition:none;
						}
						@media(max-width:600px){
							margin-top:15px;
						}
						.tit{
							cursor:pointer;
							position:relative;
							@media(max-width:1024px){
								border:none;
								margin:0 30px;
								padding:15px 0;
							}
							@media(max-width:600px){
								margin:0 20px;
							}
							.txt{
								@include fz(16px,60px);
								color:#333;
								@extend .ellipsis;
								transition:background 0.3s,color 0.3s;
								padding-left:27px;
								background:url(../img/sl.png) no-repeat left center;
								@media(max-width:1024px){
									@include fz(18px,30px);
									white-space: normal;
									background:url(../img/sl.png) no-repeat left 10px;
									padding-right:35px;
								}
								@media(max-width:600px){
									padding-left:18px;
									background:url(../img/sl.png) no-repeat left 6px;
									@include fz(16px,24px);
								}
							}
							.ico{
								position:absolute;
								width:30px;
								height:30px;
								background:url(../img/jia2.png) no-repeat right center;
								background-size:cover;
								right:0;
								top:50%;
								margin-top:-15px;
								display: none;
								@media(max-width:1024px){
									display: block;
								}
								@media(max-width:600px){
									width:24px;
									height:24px;
									background-size:cover !important;
									margin-top:-12px;
								}
							}
						}
						.content{
							display: none;
							@media(max-width:1024px){
								border-bottom:1px solid #ececec;
								background:#fff;
								padding:0 30px;
								&.show{
									display: block;
								}
							}
							@media(max-width:600px){
								padding:0 20px;
							}
							.job_top{
								padding-top:20px;
								border-bottom:1px solid #d2d2d2;
								padding-bottom:33px;
								@media(max-width:1200px){
									padding-top:30px;
									padding-bottom:20px;
								}
								@media(max-width:600px){
									padding:20px 0;
								}
								.job_ds{
									.name{
										@include fz(20px,36px);
										color:#333;
									}
									.time{
										@include fz(14px,26px);
										color:#666;
									}
								}
								.msg{
									margin-top:15px;
									span{
										display: inline-block;
										border:1px solid #cecece;
										padding:0 15px;
										margin:8px 8px 8px 0;
										border-radius:20px;
										@include fz(14px,40px);
										color:#666;
										box-sizing:border-box;
										&.span{
											display: none;
										}
										@media(max-width:600px){
											line-height:36px;
											font-size:13px;
											margin:5px 5px 5px 0;
										}
										@media(max-width:400px){
											line-height:36px;
											font-size:12px;
											padding:0 12px;
											margin:5px 5px 5px 0;
										}
									}
									@media(max-width:1400px){
										margin-top:15px;
									}
								}
							}
							.cont{
								padding:30px 0;
								@media(max-width:1024px){
									padding:20px 0;
								}
								.t{
									@include fz(16px,24px);
									color:#666;
									font-weight:bold;
								}
								.con{
									@include fz(14px,24px);
									color:#666;
									padding-bottom:20px;
									@media(max-width:600px){
										padding-bottom:15px;
									}
								}
								.apply{
									width:180px;
									height:50px;
									background:$color;
									@include fz(18px,50px);
									color:#fff;
									text-align: center;
									display: block;
									margin-top:10px;
									@media(max-width:600px){
										width:120px;
										height:40px;
										@include fz(14px,40px);
									}
								}
							}
						}
					}
				}
			}
		}
		.map_box{
			margin-top:70px;
			position:relative;
			@media(max-width:1200px){
				margin-top:50px;
			}
			@media(max-width:1024px){
				margin-top:30px;
			}
			@media(max-width:600px){
				margin-top:20px;
			}
			#map{
				width:100%;
				border:1px solid #dbd8d8;
				box-sizing:border-box;
				height:705px;
				box-shadow:0 0 3px 3px #edecec;
				.anchorBL{
					display: none;
				}
				@media(max-width:1200px){
					height:600px;
				}
				@media(max-width:1024px){
					height:4rem;
				}
			}
			.map_content{
				position:absolute;
				border: 1px solid #dadada;
				background-color: #fff;
				box-shadow: 4px 7px 16px rgba(7,0,2,.13);
				width:488px;
				top:60px;
				right:60px;
				bottom:60px;
				// height:83%;
				box-sizing:border-box;
				.mCustomScrollBox>.mCSB_scrollTools{
					width:6px;
				}
				.mCSB_container{
					margin-right:0;
				}
				.mCSB_scrollTools .mCSB_draggerRail{
					width:6px;
					background: #f1f1f1;
				}
				.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
					width:6px;
				}
				@media(max-width:1024px){
					position:static;
					width:100%;
					margin-top:30px;
				}
				@media(max-width:768px){
					margin-top:15px;
				}
				ul{
					padding:0 37px;
					@media(max-width:768px){
						padding:0 15px;
					}
					li{
						padding-bottom:22px;
						padding-top:28px;
						border-bottom:1px solid #e9e9e9;
						@media(max-width:768px){
							padding:18px 0;
						}

						.tit{
							position:relative;
							padding-left:32px;
							span{
								position:absolute;
								left:0;
								top:0;
								width:22px;
								height:30px;
								background:url(../img/address.png) no-repeat;
								@include fz(14px,24px);
								color:#fff;
								font-weight: bold;
								text-align: center;
							}
							.txt{
								@include fz(22px,30px);
								color:#333;
								@media(max-width:1024px){
									@include fz(18px,30px);
								}
								@media(max-width:600px){
									@include fz(16px,30px);
								}
							}
						}
						.con{
							padding-left:32px;
							@include fz(16px,32px);
							color:#666;
							margin-top:10px;
							@media(max-width:1024px){
								@include fz(14px,24px);
								margin-top:5px;
							}
						}
					}
				}
			}
		}
	}
	
	.main_top.removeFixed{
		z-index: 900;
		.tab{
			position: fixed;
			left: 0;
			top: 0;
			box-shadow: 0px 0px 6px 0px rgba( 1, 1, 1,0.31);
		}
	}
	.sales{
		.sales_box{
			padding-bottom:130px;
			padding-top:100px;
			&.sales_box2{
				padding-bottom:100px;
			}
			&.none{
				padding-bottom:0;
				.problem_list{
					padding-bottom:80px;
					margin-top:30px;
					@media(max-width:1024px){
						padding-bottom:50px;
					}
					@media(max-width:600px){
						padding-bottom:30px;
						margin-top:15px;
					}
				}
			}
			@media(max-width:1024px){
				padding-top:70px;
				padding-bottom:110px;
				&.sales_box2{
					padding-bottom:70px;
				}
			}
			@media(max-width:800px){
				padding-bottom:70px;
			}
			@media(max-width:600px){
				padding-top:25px;
				padding-bottom:35px;
				&.sales_box2{
					padding-bottom:30px;
				}
			}
			.title{
				.cn{
					color:#333;		
				}
				.en{
					color:#999;
				}
			}
			.safe_box{
				margin-top:78px;
				background: #fff;
				box-shadow: 0 0 5px rgba(7,0,2,.13);
				padding:45px;
				@media(max-width:1024px){
					padding:30px;
					margin-top:50px;
				}
				@media(max-width:600px){
					padding:15px;
					margin-top:25px;
				}
				.pic{
					overflow: hidden;
					img{
						width:100%;
						height: auto;
					}
				}
				.safe_list{
					margin-bottom:52px;
					position:relative;
					margin-top:38px;
					@media(max-width:800px){
						margin-bottom:30px;
						margin-top:20px;
					}
					.line{
						position:absolute;
						border: 1px solid #e6e6e6;
						width:9px;
						border-radius:3px 2px;
						background-color: #fff;
						box-sizing:border-box;
						top:40px;
						bottom:0;
						box-shadow: 0 0 7px rgba(7,0,2,.08);
						&.line1{
							left:15px;
							@media(max-width:500px){
								left:9px;
							}
						}
						&.line2{
							left:52.6%;
							margin-left:14px;
							@media(max-width:900px){
								display: none;
							}
						}
					}
					ul{
						li{
							float:left;
							position:relative;
							height:110px;
							padding-left:63px;
							box-sizing:border-box;
							width:47.4%;
							@media(max-width:1400px){
								height:130px;
							}
							@media(max-width:1024px){
								height:150px;
							}
							@media(max-width:500px){
								padding-left:50px;
							}
							&:nth-child(even){
								float:right;
							}
							@media(max-width:900px){
								float:none;
								width:100%;
								min-height:52px;
								height: auto;
								margin-top:15px;
								&:first-child{
									margin-top:0;
								}
								&:nth-child(even){
									float:none;
								}
							}
							.num{
								border: 1px solid #e6e6e6;
								border-radius:50%;
								width:52px;
								height:52px;
								text-align: center;
								@include fz(24px,52px);
								color:#999;
								position:absolute;
								left:-8px;
								box-sizing:border-box;
								top:50%;
								margin-top:-26px;
								background-color: #fff;
								box-shadow: 0 0 7px rgba(7,0,2,.08);
								font-family: "Roboto";
								@media(max-width:500px){
									width:40px;
									height: 40px;
									@include fz(20px,40px);
									margin-top:-20px;
								}
							}
							.cont{
								height:100%;
								background:url(../img/line2.jpg) no-repeat bottom center;
								background-size:100% 1px;
								@media(max-width:900px){
									background:none;
								}
								.tab{
									width:100%;
									height:100%;
									display:table;
									@media(max-width:900px){
										min-height:52px;
									}
									.tab_cell{
										display: table-cell;
										vertical-align: middle;
										@include fz(16px,28px);
										color:#333;
										@media(max-width:1400px){
											@include fz(16px,24px);
										}
										@media(max-width:1200px){
											@include fz(14px,24px);
										}
									}
								}
							}
						}
					}
				}
			}
			.policy_box{
				margin-top:25px;
				@media(max-width:600px){
					margin-top:10px;
				}
				ul{
					li{
						padding-top:30px;
						@media(max-width:1024px){
							padding-top:20px;
						}
						@media(max-width:500px){
							padding-top:15px;
						}
						.tit{
							@include fz(24px,36px);
							color:#333;
							@media(max-width:1300px){
								@include fz(20px,30px);
							}
							@media(max-width:600px){
								@include fz(18px,24px);
							}
						}
						.cont{
							margin-top:14px;
							@include fz(16px,28px);
							color:#666;
							padding-bottom:45px;
							background:url(../img/line.png) no-repeat bottom center;
							background-size:100% 1px;
							@media(max-width:1024px){
								@include fz(14px,24px);
								padding-bottom:30px;
							}
							@media(max-width:500px){
								padding-bottom:15px;
								margin-top:10px;
							}
						}
						.table{
							background: #fff;
							overflow:auto;
							margin-top:35px;
							margin-bottom: 22px;
							box-shadow: 0 0 10px rgba(7,0,2,.1);
							@media(max-width:1024px){
								margin-top:25px;
								margin-bottom:20px;
							}
							@media(max-width:500px){
								margin-top:15px;
								margin-bottom:10px;
							}
							table{
								width:100%;
								tr{
									td{
										border:1px solid #e6e6e6;
										@include fz(14px,24px);
										color:#666;
										padding:15px 5px;
										@media(max-width:600px){
											@include fz(13px,20px);
											padding:10px 3px;
										}
									}
								}
							}
						}
					}
				}
			}
			.charge_box{
				margin-top:90px;
				@media(max-width:1024px){
					margin-top:60px;
				}
				@media(max-width:600px){
					margin-top:30px;
				}
				.m_list{
					display: none;
					position:relative;
					margin-bottom:40px;
					@media(max-width:1024px){
						display: block;
					}
					@media(max-width:600px){
						margin-bottom:20px;
					}
					.line{
						position:absolute;
						width:100%;
						height:1px;
						background: #ccc;
						&::before{
							content:'';
							display:block;
							width:8px;
							height:8px;
							position:absolute;
							border-radius:50%;
							left:0%;
							background: #fafafa;
							top:-4px;
							border:1px solid #cdcdcd;
							box-sizing:border-box;
						}
						&::after{
							content:'';
							display:block;
							width:8px;
							height:8px;
							position:absolute;
							background: #fafafa;
							box-sizing:border-box;
							right:0;
							border-radius:50%;
							top:-4px;
							border:1px solid #cdcdcd;
						}
					}
					ul{
						font-size:0;
						text-align: center;
						li{
							width:25%;
							@include fz(14px,24px);
							color:#333;
							position:relative;
							display: inline-block;
							z-index:10;
							vertical-align: top;
							cursor:pointer;
							&:first-child{
								margin-top:0;
							}
							@media(max-width:600px){
								@include fz(13px,20px);
							}
							&.active{
								.ico{
									.active{
										transform:scale(1);
									}
								}
							}
							@media(min-width:1024px){
								&:hover{
									.ico{
										.active{
											transform:scale(1);
										}
									}
								}
							}
							.ico{
								position:absolute;
								left:0;
								top:0;
								width:100%;
								// height:100%;
								i{
									position:absolute;
									width:8px;
									height:8px;
									border-radius:50%;
									background: #d4d4d4;
									display: block;
									left:50%;
									margin-left:-4px;
									top:0%;
									margin-top:-4px;
									@media(max-width:600px){
										width:6px;
										height:6px;
										margin-left:-3px;
										margin-top:-3px;
									}
								}
								.active{
									width:22px;
									height:22px;
									position:absolute;
									left:50%;
									margin-left:-11px;
									border:1px solid $color;
									transition:transform 0.5s;
									border-radius:50%;
									transform:scale(0);
									top:-11px;
									box-sizing:border-box;
									@media(max-width:600px){
										width:14px;
										height:14px;
										top:-7px;
										margin-left:-7px;
									}
									span{
										width:12px;
										height:12px;
										border-radius:50%;
										background:$color;
										position:absolute;
										left:50%;
										margin-left:-6px;
										top:50%;
										margin-top:-6px;
										@media(max-width:600px){
											width:6px;
											height:6px;
											margin-left:-3px;
											margin-top:-3px;
										}
									}
								}
							}
							.txt{
								display: block;
								margin-top:20px;
								padding:0 3px;
								@media(max-width:600px){
									margin-top:15px;
								}
							}
						}
					}
				}
				.fix{
					float:left;
					width:11.8%;
					margin-left:14px;
					box-sizing:border-box;
					position:relative;
					@media(max-width:1200px){
						width:15%;
					}
					&.fixed{
						position:fixed;
						top:100px;
					}
					@media(max-width:1024px){
						display: none;
					}
					.line{
						position:absolute;
						width:1px;
						height:100%;
						background: #ccc;
						&::before{
							content:'';
							display:block;
							width:8px;
							height:8px;
							position:absolute;
							border-radius:50%;
							left:50%;
							background: #fafafa;
							margin-left:-4px;
							top:0;
							border:1px solid #cdcdcd;
							box-sizing:border-box;
						}
						&::after{
							content:'';
							display:block;
							width:8px;
							height:8px;
							position:absolute;
							background: #fafafa;
							box-sizing:border-box;
							left:50%;
							border-radius:50%;
							margin-left:-4px;
							bottom:0;
							border:1px solid #cdcdcd;
						}
					}
					ul{
						padding:50px 0;
						li{
							@include fz(14px,24px);
							color:#333;
							padding-left:40px;
							position:relative;
							margin-top:25px;
							z-index:10;
							cursor:pointer;
							&:first-child{
								margin-top:0;
							}
							&.active{
								.ico{
									.active{
										transform:scale(1);
									}
								}
							}
							@media(min-width:1024px){
								&:hover{
									.ico{
										.active{
											transform:scale(1);
										}
									}
								}
							}
							.ico{
								position:absolute;
								left:0;
								top:0;
								height:100%;
								i{
									position:absolute;
									width:8px;
									height:8px;
									border-radius:50%;
									background: #d4d4d4;
									display: block;
									left:0;
									margin-left:-4px;
									top:50%;
									margin-top:-4px;
								}
								.active{
									width:22px;
									height:22px;
									position:absolute;
									left:0;
									margin-left:-11px;
									border:1px solid $color;
									transition:transform 0.5s;
									border-radius:50%;
									transform:scale(0);
									span{
										width:12px;
										height:12px;
										border-radius:50%;
										background:$color;
										position:absolute;
										left:50%;
										margin-left:-6px;
										top:50%;
										margin-top:-6px;
									}
								}
							}
						}
					}
				}
				.charge_content{
					background-color: #fff;
					box-shadow: 0 0 7px rgba(7,0,2,.11);
					width:86.1%;
					float:right;
					padding:45px 5.5% 80px 5.5%;
					box-sizing:border-box;
					@media(max-width:1200px){
						width:80%;
					}
					@media(max-width:1024px){
						width:100%;
						float:none;
					}
					@media(max-width:800px){
						padding:30px 5.5% 50px 5.5%;
					}
					.list_box{
						display: none;
						&.show{
							display: block;
						}
					}
					.t{
						@include fz(36px,56px);
						color:#333;
						@media(max-width:1400px){
							@include fz(30px,50px);
						}
						@media(max-width:1024px){
							@include fz(26px,44px);
						}
						@media(max-width:750px){
							@include fz(20px,30px);
						}
					}
					.table{
						margin-top:28px;
						overflow:auto;
						@media(max-width:700px){
							margin-top:20px;
						}
						table{
							width:100%;
							@media(max-width:700px){
								width:700px;
							}
							tr{
								&.firstRow{
									background: #f7f7f7;
									td{
										font-size:16px;
										color:#333;
										font-weight:bold;
										@media(max-width:700px){
											font-size:15px;
										}
									}
								}
								td{
									text-align: center;
									border:1px solid #e3e3e3;
									@include fz(14px,24px);
									color:#666;
									padding:13px 20px;
									box-sizing:border-box;
									@media(max-width:700px){
										@include fz(13px,20px);
										padding:10px;
									}
								}
							}
							
						}
					}
				}
			}
			.service_list{
				margin-top:78px;
				@media(max-width:1200px){
					margin-top:55px;
				}
				@media(max-width:1024px){
					margin-top:40px;
				}
				@media(max-width:600px){
					margin-top:20px;
				}
				.swiper_service{
					.swiper-container{
						display: none;
						@media(max-width:1024px){
							display: block;
						}
						.swiper-pagination{
							position:static;
							margin-top:20px;
							line-height:0;
							span{
								&.swiper-pagination-bullet-active{
									background:$color;
								}
							}
						}
						.swiper-wrapper{
							.swiper-slide{
								background: #fff;
								a{	
									padding:40px 10px;
									display: block;
									width:100%;
									box-sizing:border-box;
									text-align: center;
									@media(max-width:750px){
										padding:30px 10px;
									}
									.ico{
										width:50px;
										height:50px;
										margin:0 auto;
										img{
											width:100%;
											height:auto;
										}
										@media(max-width:750px){
											width:40px;
											height:40px;
										}
									}
									.txt{
										@include fz(20px,28px);
										margin-top:15px;
										color:#333;
										@media(max-width:750px){
											@include fz(18px,24px);
											margin-top:15px;
										}
									}
									.more{
										display: inline-block;
										@include fz(14px,20px);
										color:$color;
										transition:all 0.5s ease;
										margin-top:20px;
										i{
											display: inline-block;
											vertical-align: middle;
											width:5px;
											height:9px;
											transition:background 0.5s ease;
											background:url(../img/ar.png) no-repeat;
											margin-left:7px;
											@media(max-width:600px){
												margin-left:4px;
											}
										}
										@media(max-width:750px){
											margin-top:15px;
										}
									}
								}	
							}
						}
					}
				}
				ul{
					width:110%;
					@media(max-width:1024px){
						display: none;
					}
					li{
						float:left;
						width:21.46%;
						margin-right:1.76%;
						background-color: #fff;
						box-shadow: 0 0 5px rgba(7,0,2,.1);
						height:370px;
						text-align: center;
						box-sizing:border-box;
						transition:background 0.5s ease;
						@media(min-width:1024px){
							&:hover{
								background:$color;
								a{
									.tab{
										.tab_cell{
											.ico{
												img{
													@include opacity(0);
													&.active{
														@include opacity(1);
													}
												}
											}
											.txt{
												color:#fff;
											}
											.more{
												color:#fff;
												i{
													background:url(../img/ar2.png) no-repeat;
												}
											}
										}
									}
								}
							}
						}
						a{
							display: block;
							height:100%;
							padding:0 10px;
							.tab{
								width:100%;
								height:100%;
								display:table;
								.tab_cell{
									display: table-cell;
									vertical-align: middle;
									.ico{
										width:74px;
										height:74px;
										text-align: center;
										position:relative;
										overflow: hidden;
										margin:0 auto;
										@media(max-width:1300px){
											width:60px;
											height: 60px;
										}
										@media(max-width:1100px){
											width:50px;
											height:50px;
										}
										img{
											max-width:100%;
											max-width:100%;
											transition:opacity 0.5s ease;
											@include opacity(1);
											position:absolute;
											left:0;
											top:0;
											&.active{
												@include opacity(0);
											}
										}
										
									}
									.txt{
										@include fz(24px,32px);
										color:#333;
										margin-top:30px;
										transition:color 0.5s ease;
										@media(max-width:1300px){
											@include fz(20px,30px);
											margin-top:20px;
										}
									}
									.more{
										display: inline-block;
										@include fz(14px,20px);
										color:$color;
										transition:all 0.5s ease;
										margin-top:32px;
										@media (max-width:1300px) {
											margin-top:25px;
										}
										i{
											display: inline-block;
											vertical-align: middle;
											width:5px;
											height:9px;
											transition:background 0.5s ease;
											background:url(../img/ar.png) no-repeat;
											margin-left:7px;
										}
									}
								}
							}
						}
					}
				}
				
			}
			
			.problem_box{
				position:relative;
				margin-top:78px;
				@media(max-width:1200px){
					margin-top:55px;
				}
				@media(max-width:1024px){
					margin-top:40px;
				}
				@media(max-width:600px){
					margin-top:20px;
				}

				.problem_l{
					width:64.1%;
					background: #fff;
					position:absolute;
					left:0;
					top:0;
					height:100%;
					box-shadow: 0 5px 40px rgba(142,142,142,.1);
					padding:0 2.9%;
					box-sizing:border-box;
					@media(max-width:850px){
						position:static;
						height:auto;
						width:100%;
						padding:20px;
					}
					.t{
						@include fz(24px,36px);
						color:#333;
						margin-top:30px;
						a{
							display: block;
							color:#333;
							transition:all 0.5s;
							@media(min-width:1024px){
								&:hover{
									color:$color;
								}
							}
						}
						@media(max-width:1300px){
							@include fz(20px,32px);
							margin-top:20px;
						}
						@media(max-width:850px){
							margin-top:0;
						}
						@media(max-width:600px){
							@include fz(18px,28px);
						}
					}
					.list{
						margin-top:17px;
						@media(max-width:850px){
							margin-top:10px;
							padding-bottom:20px;
						}
						@media(max-width:600px){
							margin-top:0;
						}
						ul{
							li{
								border-bottom:1px solid #ddd;
								&.active{
									.ti{
										&::after{
											transform:rotate(135deg);
										}
									}
								}

								.ti{	
									@include fz(16px,24px);
									color:#333;
									padding-right:23px;
									cursor:pointer;
									position:relative;
									height:56px;
									@media(max-width:850px){
										height: auto;
										@include fz(15px,24px);
										padding:15px 0;
										padding-right:20px;
									}
									&::after{
										content:'';
										position:absolute;
										display: block;
										width:14px;
										height:14px;
										background:url(../img/icon_close.png) no-repeat;
										right:8px;
										top:50%;
										margin-top:-7px;
										transition:transform 0.3s ease-out;
										@media(max-width:850px){
											right:0;
										}
									}
									.tab{
										width:100%;
										height:100%;
										display:table;
										@media(max-width:850px){
											display: block;
										}
										.tab_cell{
											display: table-cell;
											vertical-align: middle;
											@media(max-width:850px){
												display: block;
											}
										}
									}
								}
								.con{
									@include fz(14px,28px);
									color:#666;
									display: none;
									padding-bottom:24px;
									@media(max-width:1300px){
										padding-bottom:15px;
									}
									.mCSB_container{
										margin-right:10px;
									}
									&.show{
										display: block;
									}
									@media(max-width:850px){
										@inlcude fz(14px,24px);
										max-height:none !important;
									}
								}
							}
						}
					}
				}
				.links{
					float:right;
					width:33.5%;
					@media(max-width:850px){
						width:100%;
						float:none;
					}
					ul{
						li{
							height:234px;
							padding-top:38px;
							box-sizing:border-box;
							width:100%;
							box-shadow: 0 5px 40px rgba(142,142,142,.1);
							@media(max-width:1300px){
								height:200px;
								padding-top:30px;
							}
							&:nth-child(even){
								margin-top:7.5%;
								a{
									.tit{
										.cn,.en{
											color:#fff;
										}
									}
								}
							}
							@media(max-width:850px){
								height:180px;
								margin-top:20px !important;
							}
							@media(max-width:600px){
								height:130px;
							}
							a{
								display: block;
								padding:0 8.6%;
								height:100%;
								@media(max-width:850px){
									padding:0 4%;
								}
								@media(min-width:1024px){
									&:hover{
										.tit{
											transform:translateY(23%);
										}
									}
								}
								.tit{
									transition:transform 0.5s ease;
									.cn{
										@include fz(24px,40px);
										color:#222;
										font-weight:bold;
										@media(max-width:1300px){
											@include fz(20px,36px);
										}
										@media(max-width:600px){
											@include fz(18px,28px);
										}
									}
									.en{
										color:#222;
										text-transform:uppercase;
										font-family: "Roboto";
										@include fz(18px,30px);
										@media(max-width:600px){
											@include fz(13px,20px);
										}
									}
									.ico{
										margin-top:9px;
										@media(max-width:600px){
											margin-top:3px;
											img{
												height:16px;
											}
										}
									}
								}
							}
						}
					}
					
				}
			}
			.content{
				@include fz(14px,24px);
				color:#666;
				margin-top:30px;
				@media(max-width:800px){
					margin-top:20px;
				}
			}
			.box{
				position:relative;
				margin-top:70px;
				@media(max-width:1200px){
					margin-top:55px;
				}
				@media(max-width:1024px){
					margin-top:40px;
				}
				@media(max-width:600px){
					margin-top:20px;
				}
				ul{
					width:110%;
					@media(max-width:850px){
						width:100%;
						text-align: center;
						font-size:0;
					}
					li{
						float:left;
						background-color: #fff;
						box-shadow: 0 0 13px rgba(7,0,2,.13);
						width:29.16%;
						margin-right:1.8%;
						@media(min-width:1024px){
							&:hover{
								a{
									.pic{
										img{
											transform:scale(1.05);
										}
									}
								}
							}
						}
						@media(max-width:850px){
							display: inline-block;
							vertical-align: top;
							width:48%;
							float:none;
							margin:15px 1%;
						}
						@media(max-width:600px){
							width:100%;
							margin:20px 0 0 0;
						}
						a{
							display: block;
							padding:26px;
							padding-bottom:0;
							@media(max-width:1200px){
								padding:15px;
								padding-bottom:0;
							}
							.pic{
								overflow: hidden;
								img{
									width:100%;
									transition:all 0.5s ease-in-out;
									height:auto;
								}
							}
							.cont{
								padding:27px 0;
								@media(max-width:1200px){
									padding:20px 0;
								}
								@media(max-width:1024px){
									padding:10px 0;
								}
								@media(max-width:600px){
									padding:20px 0;
								}
								.t{
									@include fz(24px,40px);
									color:#333;
									@media(max-width:1300px){
										@include fz(20px,36px);
									}
									@media(max-width:600px){
										@include fz(18px,28px);
									}
								}
								.more{
									display: inline-block;
									@include fz(14px,20px);
									color:$color;
									transition:all 0.5s ease;
									margin-top:10px;
									@media(max-width:1024px){
										margin-top:5px;
									}
									i{
										display: inline-block;
										vertical-align: middle;
										width:5px;
										height:9px;
										transition:background 0.5s ease;
										background:url(../img/ar.png) no-repeat;
										margin-left:7px;
									}
								}
							}
						}
					}
				}
			}
			.proposal{
				position:relative;
				margin-top:70px;
				@media(max-width:1200px){
					margin-top:55px;
				}
				@media(max-width:1024px){
					margin-top:40px;
				}
				@media(max-width:600px){
					margin-top:20px;
				}
				.form_box{
					position:absolute;
					right:0;
					top:0;
					height:100%;
					width:50%;
					display: block;
					background:$color;
					padding:0 6.25%;
					box-sizing:border-box;
					@media(max-width:700px){
						position:static;
						width:100%;
						padding:6% 6.25%;
						margin-top:20px;
					}
					.tab{
						width:100%;
						display:table;
						height:100%;
						.tab_cell{
							text-align: center;
							display: table-cell;
							vertical-align: middle;
							.t{
								@include fz(30px,44px);
								color:#fff;
								@media(max-width:1300px){
									@include fz(26px,40px);
								}
								@media(max-width:600px){
									@include fz(20px,34px);
								}
							}
							select{
								display: block;
								width:100%;
								height:50px;
								background:none;
								border:1px solid #efe3d1;
								box-sizing:border-box;
								@include fz(14px,50px);
								padding-left:25px;
								color:#eeddc4;
								margin-top:34px;
								appearance:none;
							    -moz-appearance:none;
							    -webkit-appearance:none;
							    background:url(../img/x.png) no-repeat 95% center;
								option{
									background-color:$color;
									display: block;
								}
								@media(max-width:1300px){
									margin-top:20px;
								}
								@media(max-width:1024px){
									height:40px;
									line-height:40px;
								}
								@media(max-width:750px){
									margin-top:10px;
								}
							}
							.submit{
								@include fz(18px,44px);
								width:150px;
								height:44px;
								display: block;
								margin-left: auto;
								margin-right:auto;
								margin-top:30px;
								background: #fff;
								border-radius:5px;
								color:$color;
								text-align: center;
								@media(max-width:1300px){
									margin-top:20px;
								}
								@media(max-width:1024px){
									width:120px;
									height:36px;
									@include fz(16px,36px);
								}
								@media(max-width:750px){
									margin-top:15px;
									width:100px;
									@include fz(14px,30px);
									height: 30px;
								}
							}
						}
					}
				}
				.pic{
					width:50%;
					display: block;
					text-align: center;
					padding:5.4% 10px;
					box-sizing:border-box;
					@media(max-width:700px){
						width:100%;
						padding:8% 10px;
					}
					.cont{
						.t{
							@include fz(30px,50px);
							color:#fff;
							@media(max-width:1300px){
								@include fz(26px,40px);
							}
							@media(max-width:600px){
								@include fz(20px,34px);
							}
						}
						.con{
							@include fz(14px,18px);
							color:#fff;
							margin-top:13px;
						}
						.more{
							display: inline-block;
							@include fz(14px,20px);
							color:$color;
							transition:all 0.5s ease;
							margin-top:25px;
							i{
								display: inline-block;
								vertical-align: middle;
								width:5px;
								height:9px;
								transition:background 0.5s ease;
								background:url(../img/ar.png) no-repeat;
								margin-left:7px;
								@media(max-width:600px){
									margin-left:4px;
								}
							}
							@media(max-width:750px){
								margin-top:15px;
							}
						}
					}
				}
			}
			.video_box{
				background: #fff;
				padding-top:70px;
				padding-bottom:100px;
				@media(max-width:1200px){
					padding-top:60px;
					padding-bottom:80px;
				}
				@media(max-width:1024px){
					padding:60px 0;
				}
				@media(max-width:600px){
					padding:30px 0;
				}
				.title{
					@media(max-width:1024px){
						visibility: visible !important;
					}
				}
				.swiper_video{
					display: none;
					margin-top:45px;
					@media(max-width:600px){
						margin-top:25px;
					}
					@media(max-width:1024px){
						display: block;
					}
					.swiper-container{
						.swiper-pagination{
							position:static;
							margin-top:10px;
							span{
								&.swiper-pagination-bullet-active{
									background:$color;
								}
							}
							
						}
						.swiper-wrapper{
							.swiper-slide{
								.cont{
									@include fz(18px,30px);
									color:#333;
									text-align: center;
									margin-top: 12px;
									@media(max-width:600px){
										@include fz(16px,24px);
										margin-top:8px;
									}
								}
								.pic{
									overflow: hidden;
									background-color: #044a46;
									box-shadow: 0 0 13px rgba(7,0,2,.14);
									position:relative;
									.mask{
										position:absolute;
										left:0;
										top:0;
										width:100%;
										height:100%;
										background:rgba(0,0,0,0.5);
										z-index:10;
									}
									.play{
										width:72px;
										height:72px;
										background:url(../img/play_icon.png) no-repeat;
										background-size:cover;
										position:absolute;
										left:50%;
										margin-left:-36px;
										top:50%;
										z-index:12;
										margin-top:-36px;
										@media(max-width:1200px){
											width:60px;
											height:60px;
											margin-top:-30px;
											margin-left:-30px;
										}
										@media(max-width:600px){
											width:50px;
											height:50px;
											margin-top:-25px;
											margin-left:-25px;
										}
									}
									img{
										width:100%;
										height:auto;
									}
								}
							}
						}
					}
				}
				.video_list{
					margin-top:56px;
					@media(max-width:1024px){
						display: none;
					}
					ul{
						width:110%;
						li{
							float:left;
							width:28.66%;
							margin-right:2.39%;
							cursor:pointer;
							@media(min-width:1024px){
								&:hover{
									.pic{
										img{
											transform:scale(1.05);
										}
									}
								}
							}
							.cont{
								@include fz(18px,30px);
								color:#333;
								text-align: center;
								margin-top: 12px;
							}
							.pic{
								overflow: hidden;
								background-color: #044a46;
								box-shadow: 0 0 13px rgba(7,0,2,.14);
								position:relative;
								.mask{
									position:absolute;
									left:0;
									top:0;
									width:100%;
									height:100%;
									background:rgba(0,0,0,0.5);
									z-index:10;
								}
								.play{
									width:72px;
									height:72px;
									background:url(../img/play_icon.png) no-repeat;
									background-size:cover;
									position:absolute;
									left:50%;
									margin-left:-36px;
									top:50%;
									z-index:12;
									margin-top:-36px;
									@media(max-width:1200px){
										width:60px;
										height:60px;
										margin-top:-30px;
										margin-left:-30px;
									}
								}
								img{
									width:100%;
									height:auto;
									transition:transform 0.5s ease-in-out;
								}
							}
						}
					}
				}
			}
			.problem_list{
				margin-top:65px;
				@media(max-width:1024px){
					visibility: visible !important;
				}
				@media(max-width:850px){
					margin-top:30px;
					padding-bottom:20px;
				}
				@media(max-width:600px){
					margin-top:20px;
				}
				.problem_list_pc{
					@media(max-width:850px){
						display: none;
					}
				}
				.problem_list_m{
					display: none;
					@media(max-width:850px){
						display: block;
					}
				}
				.page_box{
					padding-top:62px;
					clear:both;
					@media(max-width:1024px){
						padding-top:30px;
					}
					@media(max-width:600px){
						padding-top:20px;
					}
				}
				ul{
					width:48.9%;
					float:left;
					&:nth-child(even){
						float:right;
					}
					@media(max-width:850px){
						width:100%;
						float:none;
						&:nth-child(even){
							float:none;
						}
					}
					li{
						box-sizing:border-box;
						padding:0 20px;
						margin-top:4%;
						background-color: #fff;
						box-shadow: 0 0 5px rgba(7,0,2,.15);
						@media(max-width:850px){
							padding-left:15px;
							padding-right:20px;
						}
						&.active{
							.ti{
								&::after{
									transform:rotate(135deg);
								}
							}
						}

						.ti{	
							@include fz(16px,24px);
							color:#333;
							cursor:pointer;
							position:relative;
							height:64px;						
							padding-right:32px;
							@media(max-width:850px){
								height: auto;
								@include fz(15px,24px);
								padding:10px 0;
								padding-right:20px;
							}
							&::after{
								content:'';
								position:absolute;
								display: block;
								width:29px;
								height:29px;
								background:url(../img/ico_close.png) no-repeat;
								right:0px;
								top:50%;
								margin-top:-14.5px;
								transition:transform 0.3s ease-out;
								@media(max-width:850px){
									right:0;
									width:20px;
									height:20px;
									background-size:cover;
									margin-top:-10px;
								}
							}
							.tab{
								width:100%;
								height:100%;
								display:table;
								@media(max-width:850px){
									display: block;
								}
								.tab_cell{
									display: table-cell;
									vertical-align: middle;
									@media(max-width:850px){
										display: block;
									}
								}
							}
						}
						.con{
							@include fz(14px,28px);
							color:#666;
							display:none;
							padding-top:24px;
							padding-bottom:50px;
							border-top:1px solid #e5e5e5;
							@media(max-width:1300px){
								padding-top:15px;
								padding-bottom:30px;
							}
							@media(max-width:850px){
								padding:15px 0;
								@inlcude fz(14px,24px);
								max-height:none !important;
							}
						}
					}
				}
			}
			.category{
				margin-top:85px;
				@media(max-width:1024px){
					margin-top:55px;
				}
				@media(max-width:600px){
					margin-top:20px;
				}
				ul{
					text-align: center;
					font-size:0;
					li{
						cursor:pointer;
						margin:0 55px;
						display: inline-block;
						@media(max-width:1300px){
							margin:0 30px;
						}
						@media(max-width:1024px){
							margin:0 15px;
						}
						@media(max-width:750px){
							margin:0 8px;
						}
						@media(max-width:600px){
							width:33.33%;
							margin:10px 0;
							padding:0 10px;
							box-sizing:border-box;
						}
						&.active{
							.ico{
								img{
									@include opacity(0);
									&.active{
										@include opacity(1);
									}
								}
							}
							.txt{
								color:#ed6d01;
							}
						}
						@media(min-width:1024px){
							&:hover{
								.ico{
									img{
										@include opacity(0);
										&.active{
											@include opacity(1);
										}
									}
								}
								.txt{
									color:#ed6d01;
								}
							}
						}
						.ico{
							width:81px;
							height:58px;
							overflow: hidden;
							margin:0 auto;
							display: block;
							position:relative;
							@media(max-width:750px){
								width:70px;
								height:50px;
							}
							@media(max-width:600px){
								width:56px;
								height:40px;
							}
							img{
								position:absolute;
								left:0;
								top:0;
								max-width:100%;
								max-width:100%;
								transition:opacity 0.5s;
								&.active{
									@include opacity(0);
								}
							}

						}
						.txt{
							@include fz(16px,26px);
							color:#666;
							text-align: center;
							transition:color 0.5s;
							margin-top:12px;
							@media(max-width:750px){
								margin-top:6px;
							}
							@media(max-width:600px){
								@include fz(15px,24px);
								margin-top:3px;
							}
						}
					}
				}
			}
			.form{
				padding-bottom:60px;
				padding-top:25px;
				&.form2{
					margin-top:75px;
					border-top:1px solid #e3e3e3;
					@media(max-width:900px){
						margin-top:30px;
					}
				}
				@media(max-width:1200px){
					padding-bottom:40px;
				}
				@media(max-width:1024px){
					padding-bottom:0;
				}
				@media(max-width:900px){
					padding-top:0;
				}
				.form_bot{
					border-top:1px solid #ddd;
					margin-top:50px;
					@media(max-width:900px){
						margin-top:30px;
					}
				}
				label{
					display: block;
					@include fz(18px,30px);
					color:#666;
					@media(max-width:1200px){
						font-size:16px;
					}
					@media(max-width:450px){
						font-size:15px;
						line-height:24px;
					}
					&.dib{
						display:inline-block;
					}
					span{
						@include fz(20px,30px);
						color:#eb2c2c;
						display: inline-block;
						vertical-align: middle;
						margin-right:10px;
						@media(max-width:1200px){
							margin-right:5px;
						}
					}
				}
				.submit{
					width:450px;
					height:70px;
					background:$color;
					@include fz(24px,70px);
					color:#fff;
					border-radius:5px;
					display: block;
					border:none;
					margin-left:auto;
					margin-right:auto;
					margin-top:85px;
					@media(max-width:1200px){
						@include fz(20px,60px);
						height: 60px;
						width:440px;
					}
					@media(max-width:1024px){
						height:50px;
						width:350px;
						margin-top:50px;
						@include fz(18px,50px);
					}
					@media(max-width:800px){
						margin-top:25px;
					}
					@media(max-width:600px){
						margin-top:20px;
						width:100%;
						height:40px;
						@include fz(16px,40px);
					}
				}
				.input_group{
					margin-top:35px;
					@media(max-width:1200px){
						margin-top:29px;
					}
					@media(max-width:900px){
						margin-top:0;
						&.input_group3{
							margin-top:15px;
						}
					}
					&.file{
						.input{
							width:48.3%;
							.input_box{
								cursor:pointer;
								margin-top:8px;
								position:relative;
								input[type="text"]{
									width:100%;
									display: block;
									margin-top:0;
									height:68px;
									background:url(../img/file.png) no-repeat 97% center #fff;
									@media(max-width:1200px){
										height:60px;
									}
									@media(max-width:450px){
										height:44px;
										background-size:auto 60%;
									}
								}
								.file_form{
									position:absolute;
									left:0;
									top:0;
									width:100%;
									height:100%;
									display: block;
									z-index:10;
									@include opacity(0);
								}
							}
						}
					}
					.code{
						float:left;
						border-radius:5px;
						margin-top:8px;
						height:50px;
						box-sizing:border-box;
						border:1px solid #dbdbdb;
						@media(max-width:1200px){
							height: 44px;
						}
						@media(max-width:450px){
							height:40px;
						}
						img{
							height:100%;
							border-radius:5px;
							width:auto;
						}
					}
					.input{
						width:31.2%;
						float:left;
						margin-right:3.1%;
						&.mr2{
							margin-right:1.7%;
							@media(max-width:900px){
								width:50%;
								float:left;
								margin-top:0;
							}
						}
						&.dib{
							margin-top:55px;
							@media(max-width:1200px){
								margin-top:50px;
							}
							@media(max-width:1130px){
								margin-top:0px;
							}
							@media(max-width:900px){
								margin-top:15px;
							}
						}
						&.w100{
							width:100%;
						}
						&:last-child{
							margin-right:0;
						}
						&.input_box2{
							width:65.55%;
							@media(max-width:900px){
								width:100%;
								float:none;
							}
						}
						@media(max-width:900px){
							width:100%;
							float:none;
							margin-top:15px;
						}
						
						.choose{
							display: inline-block;
							vertical-align:4px;
							.choose1{
								display: inline-block;	
								vertical-align:bottom;	
								margin:0 15px;
								line-height: 0;
								
								label{
									display: inline-block;	
									@include fz(14px,16px);
									color:#666;
									input{
										margin-right:5px;
										display: inline-block;	
										vertical-align: -1px;
									}
								}
							}
							
						}
						.select_box{
							.select_item{
								width:31.2%;
								float:left;
								margin-right:3.1%;
								&:last-child{
									float: right;
									margin-right:0;
								}
							}
						}
						.text{
							display: block;
							width:100%;
							margin-top:8px;
							height:50px;
							border-radius:5px;
							border:1px solid #dbdbdb;
							padding:0 20px;
							color:#666;
							@include fz(14px,50px);
							box-sizing:border-box;
							@media(max-width:1200px){
								height: 44px;
								line-height: 44px;
							}
							@media(max-width:900px){
								padding:0 12px;
							}
							@media(max-width:450px){
								height:40px;
								line-height:40px;
								font-size:14px;
							}
							&.select{
								appearance:none;
							    -moz-appearance:none;
							    -webkit-appearance:none;
							    background:url(../img/xx.png) no-repeat 95% center #fff; 
							}
							&.textarea{
								resize:none;
								height:248px;
								line-height:24px;
								padding-top:12px;
								@media(max-width:1200px){
									height:200px;
								}
								@media(max-width:600px){
									height:110px;
								}
							}
							&.date{
								padding-left:60px;
								background:url(../img/time.png) no-repeat 20px center #fff;
								@media(max-width:900px){
									background-size:auto 60%;
								}
							}
						}
						.input_box{
							input[type="text"]{
								display: block;
								width:64%;
								float:left;
								margin-top:8px;
								height:50px;
								border-radius:5px;
								border:1px solid #dbdbdb;
								padding:0 10px;
								@include fz(16px,50px);
								box-sizing:border-box;
								@media(max-width:1200px){
									height: 44px;
									line-height:44px;
								}
								@media(max-width:900px){
									margin-top:0;
								}
								@media(max-width:450px){
									height:40px;
									line-height:40px;
									font-size:14px;
								}
							}
							input[type="button"]{
								width:32.2%;
								margin-top:8px;
								height:50px;
								border:none;
								border-radius:5px;
								background: $color;
								float:right;
								color:#fff;
								@include fz(14px,50px);
								@media(max-width:1200px){
									height: 44px;
									line-height:44px;
								}
								@media(max-width:900px){
									margin-top:0;
								}
								@media(max-width:450px){
									height:40px;
									line-height:40px;
									font-size:14px;
								}
							}
						}
					}
				}
			}
			.after_box{
				margin-bottom:15px;
				margin-top:75px;
				@media(max-width:1024px){
					margin-top:55px;
				}
				@media(max-width:600px){
					margin-top: 25px;
				}
				.after_list{
					&.auto{
						ul{
							li{
								width:100%;
								height: auto !important;
							}
						}
					}
					&:last-child{
						ul{
							li{
								margin-bottom: 0;
							}
						}
					}
					ul{
						&.w110{
							width:110%;
							@media(max-width:1024px){
								width:100%;
							}
							li{
								width:29.1%;
								margin-right:1.82%;
							}
						}
						&.after_top{
							li:last-child{
								width:66.25%;
							}
						}
						li{
							width:32%;
							border: 1px solid #e6e6e6;
							background-color: #fff;
							box-shadow: 0 0 7px rgba(7,0,2,.08);
							padding:20px 16px;
							box-sizing:border-box;
							position:relative;
							min-height:106px;
							margin-bottom:1.75%;
							padding-left:156px;
							@media(max-width:1300px){
								padding-left:120px;
							}
							@media(max-width:1024px){
								width:100% !important;
								float:none;
								margin-bottom:15px !important;
								display: block;
								min-height:90px;
								margin-right:0 !important;
								height: auto !important;
							}

							@media(max-width:750px){
								padding-left:110px;
							}
							@media(max-width:500px){
								padding:15px;
							}
							.num{
								width:106px;
								height:106px;
								border-radius: 50%;
								background-color: #c79f63;
								@include fz(48px,106px);
								position:absolute;
								top:50%;
								margin-top:-53px;
								left:16px;
								@include opacity(0.8);
								color:#fff;
								text-align: center;
								font-family: "Roboto";
								@media(max-width:1300px){
									width:90px;
									height:90px;
									margin-top:-45px;
									@include fz(40px,90px);
								}
								@media(max-width:750px){
									width:70px;
									height:70px;
									margin-top:-35px;
									@include fz(30px,70px);
								}
								@media(max-width:500px){
									width:40px;
									height:40px;
									@include fz(20px,40px);
									top:10px;
									margin-top: 0;
								}
							}
							.cont{
								height:100%;
								.tab{
									width:100%;
									height:100%;
									display:table;
									.tab_cell{
										display: table-cell;
										vertical-align: middle;
										.t{
											@include fz(24px,36px);
											color:#333;
											@media(max-width:1300px){
												@include fz(20px,30px);
											}
											@media(max-width:500px){
												padding-left:50px;
												@include fz(18px,30px);
											}
										}
										.con{
											@include fz(16px,30px);
											color:#666;
											margin-top:15px;
											@media(max-width:1300px){
												@include fz(14px,24px);
											}
											@media(max-width:600px){
												margin-top:10px;
											}
										}
										.cont_box{
											margin-top:15px;
											margin-bottom:10px;
											position:relative;
											@media(max-width:600px){
												margin-top:10px;
											}
											&::before{
												content:'';
												position:absolute;
												display: block;
												width:1px;
												height:100% !important;
												background: #eaeaea;
												left:50%;
												top:0;
												@media(max-width:750px){
													display: none;
												}
											}
											.cont_l{
												width:50%;
												float:left;
												padding-right:30px;
												box-sizing:border-box;
												@include fz(16px,30px);
												color:#666;
												@media(max-width:750px){
													width:100%;
													float:none;
													padding:0 !important;
												}
												span{
													color:#333;
												}
												@media(max-width:1300px){
													@include fz(14px,24px);
												}
												&:nth-child(even){
													padding-right:0;
													padding-left:30px;
												}
											}
										}
									}
								}
								
							}
						}
					}
				}
				
			}
		}
	}
	.m_classification{
		display: none;
		margin-top:30px;
		&.classification_solution{
			.swiper-container{
				.swiper-wrapper{
					.swiper-slide{
						width:240px;
						@media(max-width:800px){
							width:180px;
						}
						@media(max-width:600px){
							width:150px;
						}
					}
				}
			}
		}
		@media(max-width:1024px){
			display: block;
		}
		@media(max-width:600px){
			margin-top:15px;
		}
		.swiper-container{
			height: auto !important;
			.swiper-wrapper{
				height: auto !important;
				.swiper-slide{
					height: auto !important;
					box-sizing:border-box;
					text-align: center;
					width:180px;
					@media(max-width:800px){
						width:160px;
					}
					@media(max-width:600px){
						width:120px;
					}
					.sbox{
						padding-right:20px;
						@media(max-width:600px){
							padding-right:10px;
						}
						a{
							display: block;
							width:100%;
							border:1px solid #e1e1e1;
							height:40px;
							line-height:40px;
							@include fz(16px,40px);
							color:#333;
							position:relative;
							&.active{
								background:$color;
								border-color:$color;
								color:#fff;
								.arrow{
									@include opacity(1);

								}
							}
							@media(max-width:600px){
								height: 36px;
								@include fz(14px,36px);
							}
						}
					}
					
				}
			}
		}
	}
	.classification{
		font-size:0;
		text-align: center;
		margin-top:28px;
		@media(max-width:1024px){
			display: none;
		}
		&.classification2{
			a{
				width:12.5%;
			}
		}
		&.classification_solution{
			a{
				width:240px;
				@media(max-width:1200px){
					width:200px;
				}
			}
		}
		a{
			width:180px;
			height:56px;
			display: inline-block;
			border:1px solid #e1e1e1;
			box-sizing:border-box;
			@include fz(16px,56px);
			color:#666;
			transition:background 0.5s,border-color 0.3s;
			text-align: center;
			position:relative;
			margin-left:-1px;
			@media(max-width:1300px){
				width:160px;
			}
			@media(max-width:1200px){
				width:140px;
			}
			&.active{
				background:$color;
				border-color:$color;
				color:#fff;
				.arrow{
					@include opacity(1);

				}
			}
			@media(min-width:1024px){
				&:hover{
					background:$color;
					border-color:$color;
					color:#fff;
					.arrow{
						@include opacity(1);

					}
				}
			}
			.arrow{
				width:0;
				height:0;
				border-left:10px solid transparent;
				border-right:10px solid transparent;
				border-top:10px solid $color;
				position:absolute;
				left:50%;
				margin-left:-5px;
				bottom:-10px;
				@include opacity(0);
				transition:opacity 0.3s;
			}
		}
	}
	
	.hot{
		background: #fff;
		.service_box{
			padding-top:34px;
			padding-bottom:70px;
			background-color: #fff;
			box-shadow: 0 5px 40px rgba(142,142,142,.1);
			@media(max-width:1024px){
				padding-bottom:60px;
			}
			@media(max-width:600px){
				padding-top:25px;
				padding-bottom:30px;
			}
			.ti{
				@include fz(24px,36px);
				color:#333;
				text-align: center;	
				@media(max-width:1300px){
					@include fz(20px,30px);
				}
				@media(max-width:600px){
					@include fz(18px,24px);
				}
			}
			.box{
				margin-top:47px;
				@media(max-width:1024px){
					margin-top:30px;
				}
				@media(max-width:600px){
					margin-top:10px;
				}
				ul{
					li{
						text-align: center;
						width:25%;
						border-right:1px solid #e1e1e1;
						float:left;
						padding:0 10px;
						box-sizing:border-box;
						&:last-child{
							border:none;
							margin-top:-10px;
							@media(max-width:1024px){
								margin-top:0;
							}
						}
						@media(max-width:1200px){
							height: 96px;
						}
						@media(max-width:1024px){
							width:50%;
							height: auto;
							border:none;
							padding:25px 10px;
						}
						@media(max-width:600px){
							padding:15px 10px;
						}
						.code{
							width:94px;
							height:94px;
							overflow: hidden;
							border:1px solid #e1e1e1;
							bpx-sizing:border-box;
							margin:0 auto;
							img{
								width:100%;
								height: auto;
							}
							@media(max-width:1200px){
								width:80px;
								height:80px;
							}
						}
						.ico{
							width:44px;
							height:42px;
							margin:0 auto;
							img{
								max-width:100%;
								max-height: 100%;
							}
							@media(max-width:600px){
								width:30px;
								height:32px;
							}
						}
						.txt{
							@include fz(14px,28px);
							color:#666;
							margin-top:4px;
							@media(max-width:1200px){
								@include fz(13px,20px);
							}
						}
						.con{
							margin-top:12px;
							text-align: center;
							@media(max-width:1200px){
								margin-top:8px;
							}
							@media(max-width:600px){
								margin-top:4px;
							}
							.t{
								@include fz(18px,30px);
								color:#333;
								@media(max-width:1200px){
									@include fz(16px,26px);
								}
							}
							.des{
								@include fz(14px,28px);
								color:#999;
								@media(max-width:1200px){
									@include fz(13px,20px);
								}
							}
						}
					}
				}
			}
		}
		.pro_list{
			&:last-child{
				padding-bottom:15%;
				.text_box{
					padding-top:97px;
					@media(max-width:1200px){
						padding-top:80px;
					}
					@media(max-width:1024px){
						padding-top:60px;
					}
					@media(max-width:600px){
						padding-top:30px;
					}
				}
			}
			.icon_list{
				margin-top:84px;
				@media(max-width:1024px){
					margin-top:50px;
				}
				@media(max-width:600px){
					margin-top:20px;
				}
				ul{
					font-size:0;
					text-align: center;
					li{
						display: inline-block;
						vertical-align: top;
						width:174px;
						position:relative;
						@media(max-width:1400px){
							width:140px;
						}
						@media(max-width:1200px){
							width:120px;
						}
						@media(max-width:1024px){
							width:25%;
							margin-top:20px;
						}
						&:last-child{
							&::after{
								display: none;
							}
						}
						&::after{
							content:'';
							position:absolute;
							display: block;
							width:1px;
							height:80px;
							background: #ccc;
							right:0;
							top:50%;
							margin-top:-40px;
							@media(max-width:1024px){
								display: none;
							}
						}
						a{
							display: block;
							@media(min-width:1024px){
								&:hover{
									.ico{
										transform:translate(0,-10px);
									}
								}
							}
							.ico{
								width:69px;
								height:55px;
								transition:transform 0.3s;
								margin:0 auto;
								img{
									max-width:100%;
									max-height:100%;
								}
								@media(max-width:600px){
									height:40px;
									width:51px;
								}
							}
							.txt{
								@include fz(16px,22px);
								color:#333;
								text-align: center;
								margin-top:16px;
								@media(max-width:800px){
									@include fz(14px,20px);
									margin-top:10px;
								}
							}
						}
					}
				}
			}
			.text_box{
				padding-top:64px;
				padding-bottom:55px;
				@media(max-width:600px){
					padding:30px 0;
				}
				.title{
					.cn{
						color:#333;
					}
					.en{
						color:#999;
					}
				}
				.ds{
					@include fz(16px,28px);
					color:#666;
					margin-top:20px;
					text-align: center;
					@media(max-width:1024px){
						@include fz(14px,24px);
						margin-top:15px;
					}
					@media(max-width:500px){
						margin-top:10px;
					}
				}
				.read_more{
					display: block;
					width:200px;
					height:50px;
					background: #c8a063;
					border-radius:25px;
					text-align: center;
					font-size:0;
					margin-top:40px;
					margin-left:auto;
					margin-right:auto;
					margin-bottom:40px;
					@media(min-width:1024px){
						&:hover{
							img{
								transform:translate(10px,0);
							}
						}
					}
					@media(max-width:1024px){
						margin-top:30px;
						margin-bottom:30px;
					}
					@media(max-width:600px){
						margin-top:20px;
						margin-bottom:0;
					}
					.txt{
						display: inline-block;
						@include fz(18px,50px);
						color:#fff;
						margin:0 7px;
						vertical-align: middle;
					}
					img{
						margin:0 7px;
						display: inline-block;
						vertical-align: middle;
						transition:transform 0.5s;
					}
					@media(max-width:1024px){
						width:160px;
						height:40px;
						border-radius:20px;
						.txt{
							@include fz(16px,40px);
						}
					}
					@media(max-width:600px){
						width:140px;
						height:40px;
						border-radius:20px;
						.txt{
							@include fz(14px,40px);
						}
					}
				}
				.more{
					display: block;
					width:160px;
					height:44px;
					background:$color;
					text-align: center;
					font-size:0;
					margin-top:32px;
					margin-left:auto;
					margin-right:auto;
					@media(min-width:1024px){
						&:hover{
							img{
								transform:translateX(10px);
							}
						}
					}
					@media(max-width:1024px){
						margin-top:25px;
					}
					@media(max-width:500px){
						width:120px;
						height:36px;
						margin-top: 15px;
					}
					.txt{
						@include fz(16px,44px);
						color:#fff;
						display: inline-block;
						margin:0 5px;
						vertical-align: middle;
						@media(max-width:1024px){
							font-size:14px;
						}
						@media(max-width:500px){
							line-height:36px;
						}
					}
					img{
						transition:transform 0.5s;
						margin:0 5px;
						display: inline-block;
						vertical-align: middle;
					}
				}
				.solution_swiper{
					display: none;
					margin-top:20px;
					@media(max-width:1024px){
						display: block;
					}
					@media(max-width:600px){
						margin-top:10px;
					}
					.swiper-container{
						padding:10px;
						box-sizing:border-box;
						.swiper-wrapper{
							.swiper-slide{
								box-shadow: 0 3px 10px rgba(156,156,156,.15);
								a{
									.pic{
										overflow: hidden;
										img{
											width:100%;
											height: auto;
										}
									}
									.txt{
										background: #fff;
										@include fz(16px,24px);
										padding:15px;
										box-sizing:border-box;
										color:#666;
										@extend .ellipsis;
										text-align: center;
										@media(max-width:1200px){
											padding:15px;
											line-height:24px;
										}
										@media(max-width:800px){
											@include fz(14px,20px);
											padding:13px 10px;
										}
									}
								}
							}
						}
					}
					.swiper_btn{
						text-align: center;
						font-size:0;
						margin-top:20px;
						@media(max-width:600px){
							margin-top:10px;
						}
						div{
							width:40px;
							margin:0 10px;
							height: 40px;
							border-radius:50%;
							background:url(../img/pr.png) no-repeat center center #fff;
							border-radius: 25px;
							box-shadow: 0 5px 10px rgba(156,156,156,.24);
							cursor:pointer;
							display: inline-block;
							background-size:24% auto !important;
							&.swiper_btnl{
								background:url(../img/pl.png) no-repeat center center #fff;
							}
							@media(max-width:700px){
								width:30px;
								height: 30px;
							}
						}
					}
				}
				.solution_box{
					position:relative;
					margin-top:20px;
					@media(max-width:1600px){
						width:90%;
						margin-left:10%;
					}
					@media(max-width:1024px){
						display: none;
					}
					.btn{
						width:50px;
						height:100%;
						position:absolute;
						top:0;
						left:-9.9%;
						z-index:20;
						@media(max-width:1770px){
							left:-6%;
						}
						@media(max-width:1620px){
							left:-4%;
						}
						@media(max-width:1600px){
							left:-8%;
						}
						.tab{
							width:100%;
							height:100%;
							display:table;
							.tab_cell{
								display: table-cell;
								vertical-align: middle;
								.btn_l{
									width:50px;
									height:50px;
									border-radius:50%;
									background:url(../img/pl.png) no-repeat center center #fff;
									border-radius: 25px;
									box-shadow: 0 5px 20px rgba(156,156,156,.24);
									cursor:pointer;
									transition:background 0.5s;
									@media(min-width:1024px){
										&:hover{
											background:url(../img/pl2.png) no-repeat center center $color;
											@media(max-width:1200px){
												background-size:24% auto;
											}
										}
									}
									@media(max-width:1200px){
										width:40px;
										height: 40px;
										background-size:24% auto;
									}
								}
								.btn_r{
									width:50px;
									height:50px;
									margin-top:36px;
									border-radius:50%;
									background:url(../img/pr.png) no-repeat center center #fff;
									border-radius: 25px;
									box-shadow: 0 5px 20px rgba(156,156,156,.24);
									cursor:pointer;
									transition:background 0.5s;
									@media(max-width:1200px){
										margin-top:20px;
										width:40px;
										height: 40px;
										background-size:24% auto;
									}
									@media(min-width:1024px){
										&:hover{
											background:url(../img/pr2.png) no-repeat center center $color;
											@media(max-width:1200px){
												background-size:24% auto;
											}
										}
									}
								}
							}
						}
					}
					.solution_list{
						padding:20px;
						overflow: hidden;
						margin-left:-20px;
						@media(max-width:1024px){
							display: none;
						}
						ul{
							position:relative;
							li{
								float:left;
								background-color: #fff;
								box-shadow: 0 5px 20px rgba(156,156,156,.15);
								@media(min-width:1024px){
									&:hover{
										a{
											.pic{
												img{
													transform:scale(1.05);
												}
											}
										}
									}
								}
								a{
									display: block;
									.pic{
										overflow: hidden;
										img{
											transition:all 0.5s ease-in-out;
											width:100%;
											height:auto;
										}
									}
									.txt{
										background: #fff;
										@include fz(16px,30px);
										padding:20px 15px;
										box-sizing:border-box;
										color:#666;
										text-align: center;
										@extend .ellipsis;

										@media(max-width:1200px){
											padding:15px;
											line-height:24px;
										}
									}
								}
							}
						}
					}

				}
			}
			.flexslider{
				&.flexslider2{
					.flex-control-nav{
						li{
							a{
								background:rgba(#fff,0.5);
							}
						}
					}
				}
				.flex-control-nav{
					line-height:0;
					bottom:35px;
					@media(max-width:600px){
						bottom:15px;
					}
					li{
						margin:0 10px;
						@media(max-width:600px){
							margin:0 5px;
						}
						a{
							width:10px;
							height:10px;
							background: #888;
							&.flex-active{
								background:$color;
							}
						}
					}
				}
				.slides{
					li{
						a{
							display: block;
							width:100%;
							height:100%;
							img{
								width:100%;
								height:auto;
								@media(max-width:1920px) and (min-width:1903px){
									width:1920px;
								}
								@media(max-width:1200px){
									width:120%;
									margin-left:-10%;
								}
								@media(max-width:600px){
									width:140%;
									margin-left:-20%;
								}
							}
						}
					}
				}
			}
			.cont_box{
				@include fz(24px,30px);
				color:$color;
				text-align: center;
				margin-top:80px;
				padding-bottom:200px;
				@media(max-width:1300px){
					font-size:20px;
					margin-top:50px;
					padding-bottom:150px;
				}
				@media(max-width:1024px){
					margin-top:50px;
					padding-bottom:80px;
				}
				@media(max-width:600px){
					font-size:18px;
					margin-top:0px;
					padding-bottom:30px;
				}
			}
		}
		.pro_box{
			padding-bottom:120px;
			padding-top: 94px;
			@media(max-width:1024px){
				padding-top:70px;
				padding-bottom:90px;
			}
			@media(max-width:600px){
				padding-top:30px;
				padding-bottom:35px;
			}
			.title{
				.cn{
					color:#333;
				}
				.en{
					color:#999;
				}
			}
			.ds{
				@include fz(16px,28px);
				color:#666;
				margin-top:20px;
				text-align: center;
				@media(max-width:1024px){
					@include fz(14px,24px);
					margin-top:15px;
				}
				@media(max-width:500px){
					margin-top:10px;
				}
			}
			.list{
				.page_box{
					padding:75px 0;
					@media(max-width:1024px){
						padding:55px 0;
					}
					@media(max-width:600px){
						padding:30px 0;
					}
				}
				ul{
					width:110%;
					@media(max-width:750px){
						width:100%;
					}
					li{
						float:left;
						background-color: #fff;
						background-color: #fff;
						box-shadow: 0 5px 40px rgba(142,142,142,.1);
						position:relative;
						width:29.4%;
						margin-top:1.2%;
						margin-right:1.2%;
						&:nth-child(3n){
							.hover_box{
								transform:translateX(-90%);
								left:0;
							}
						}
						@media(max-width:750px){
							width:48%;
							margin-right:0;
							margin-top:4%;
							&:nth-child(even){
								float: right;
							}
						}
						@media(min-width:1024px){
							&:hover{
								&:nth-child(3n) .hover_box{
									transform:translateX(-100%);
								}
								.hover_box{
									@include opacity(1);
									visibility: visible;
									transform:translateX(0%);
								}
							}
						}
						.hover_box{
							position:absolute;
							height:100%;
							width:104%;
							background:$color;
							left:100%;
							top:0;
							z-index:100;
							padding:0 10.3%;
							transition:all 0.5s cubic-bezier(0.4, 0, 0.2, 1);
							box-sizing:border-box;
							@include opacity(0);
							visibility: hidden;
							transform:translateX(-10%);
							@media(max-width:1300px){
								padding:0 7%;
							}
							.hover_top{
								@include fz(14px,22px);
								color:#fff;
								border-bottom:1px solid #d3b382;
								box-sizing:border-box;
								.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
   									background: #d3b382;
   								}	
								.con{
									padding-top:40px;
									height: 100%;
									box-sizing:border-box;
									padding-bottom:20px;
								}
								p{
									padding-left:20px;
									margin-top:14px;
									background:url(../img/ra.png) no-repeat left center;
								}
								@media(max-width:850px){
									p{
										margin-top:8px;
									}
								}
							}
							.bot{
								text-align:right;
								padding-top:30px;
								@media(max-width:1300px){
									padding-top:20px;
								}
								a{
									width:160px;
									height:44px;
									border:1px solid #fff;
									border-radius:22px;
									display: inline-block;
									font-size:0;
									position:relative;
									z-index:10;
									transition:background 0.3s;
									text-align: center;
									@media(min-width:1024px){
										&:hover{
											background:#fff;
											&.buy{
												i{
													background:url(../img/buy.png) no-repeat;
													background-size:cover;
												}
											}
											.txt{
												color:$color;
											}
											i{
												background:url(../img/in2.png) no-repeat;
												background-size:cover;
											}
										}
									}
									@media(max-width:1460px){
										width:140px;
										height: 40px;
									}
									@media(max-width:1200px){
										width:120px;
									}
									@media(max-width:400px){
										height: 36px;
										width:100px;
									}
									&.buy{
										margin-left:14px;
										i{
											width:22px;
											height:20px;
											background:url(../img/buy2.png) no-repeat;
											background-size:cover;
											@media(max-width:400px){
												width:16px;
												height:14px;
												background-size:cover;
											}
										}
									}
									.txt{
										margin:0 6px;
										@include fz(16px,44px);
										color:#fff;
										transition:color 0.3s;
										vertical-align: middle;
										@media(max-width:1200px){
											line-height:40px;
											@include fz(14px,40px);
											margin:0 3px;
										}
										@media(max-width:400px){
											@include fz(13px,36px);
										}
									}
									i{
										transition:background 0.3s;
										display: inline-block;
										vertical-align: middle;
										width:20px;
										height:20px;
										margin:0 6px;
										background:url(../img/in.png) no-repeat;
										background-size:cover;
										@media(max-width:1200px){
											margin:0 3px;
										}
										@media(max-width:400px){
											width:14px;
											height:14px;
										}
									}
								}
							}
						}
						a{
							display: block;
							width:100%;
							position:relative;
							
							.pic{
								width:100%;
								position:relative;
								height:294px;
								border-bottom:1px solid #e8e8e8;
								box-sizing:border-box;
								img{
									position:absolute;
									left:0;
									top:0;
									right:0;
									bottom:0;
									margin:auto;
									max-width:90%;
									max-height:90%;
								}
							}
							.cont{
								padding:20px 8.5%;
								@media(max-width:1300px){
									padding:20px 5%;
								}
								@media(max-width:1024px){
									padding:15px 5%;
								}
								@media(max-width:600px){
									padding:10px;
								}
								.t{
									@include fz(20px,36px);
									color:#333;
									@extend .ellipsis;
									@media(max-width:1300px){
										@include fz(18px,28px);
									}
									@media(max-width:800px){
										@include fz(16px,24px);
									}
								}
								.model{
									@include fz(14px,26px);
									color:#666;
									@extend .ellipsis;
									@media(max-width:1300px){
										line-height:20px;
									}
									@media(max-width:800px){
										@include fz(13px,20px);
									}
								}
							}
						}
					}
				}
			}
			.recommend{
				padding-bottom:35px;
				margin-top:48px;
				@media(max-width:1024px){
					margin-top:30px;
				}
				@media(max-width:600px){
					margin-top:18px;
					padding-bottom:15px;
				}
				ul{
					li{
						background-color: #fff;
						box-shadow: 0 5px 40px rgba(142,142,142,.1);
						float:left;
						width:49.3%;
						overflow: hidden;
						&:nth-child(even){
							float: right;
						}
						@media(max-width:750px){
							width:100%;
							float:none;
							margin-top:15px;
						}
						.pic{
							display: block;
							overflow: hidden;
							position:relative;
							img{
								width:100%;
								height: auto;
							}
							.icon{
								position:absolute;
								top:0;
								right:7%;
								display: block;
								width:60px;
								height:72px;
								background:url(../img/tj.png) no-repeat center center;
								@include fz(16px,24px);
								color:#fff;
								text-align: center;
								padding-top:6px;
								box-sizing:border-box;
								@media(max-width:1024px){
									width:50px;
									height:60px;
									background-size:cover;
									@include fz(14px,20px);
									padding-top:6px;
								}
							}
						}
						.cont{
							width:100%;
							height:240px;
							position:relative;
							@media(max-width:1024px){
								height: auto !important;
							}
							.cont_box{
								position:absolute;
								width:100%;
								top:0;
								background: #fff;
								padding:0 7.7%;
								transition:bottom 0.5s;
								box-sizing:border-box;
								@media(max-width:1024px){
									position:relative;
								}
								@media(max-width:750px){
									padding:0 30px;
								}
								@media(max-width:450px){
									padding:0 20px;
								}

								.t{
									padding-top:44px;
									@include fz(24px,36px);
									color:#333;
									@media(max-width:1300px){
										@include fz(20px,30px);
										padding-top:35px;
									}
									@media(max-width:850px){
										padding-top:20px;
									}
									@media(max-width:600px){
										@include fz(18px,28px);
									}
								}
								.con{
									@include fz(14px,22px);
									color:#666;
									margin-top:4px;
									p{
										padding-left:20px;
										margin-top:14px;
										background:url(../img/d.jpg) no-repeat left center;
									}
									@media(max-width:850px){
										p{
											margin-top:8px;
										}
									}
								}
								.bot{
									text-align:right;
									padding:20px 0;
									margin-top:25px;
									border-top:1px solid #e1e1e1;
									a{
										width:160px;
										height:44px;
										border:1px solid $color;
										border-radius:22px;
										display: inline-block;
										font-size:0;
										transition:background 0.3s;
										text-align: center;
										@media(min-width:1024px){
											&:hover{
												background:$color;
												&.buy{
													i{
														background:url(../img/buy2.png) no-repeat;
														background-size:cover;
													}
												}
												.txt{
													color:#fff;
												}
												i{
													background:url(../img/in.png) no-repeat;
													background-size:cover;
												}
											}
										}
										@media(max-width:1200px){
											width:140px;
											height: 40px;
										}
										@media(max-width:850px){
											width:120px;
										}
										@media(max-width:400px){
											height: 36px;
											width:100px;
										}
										&.buy{
											margin-left:14px;
											i{
												width:22px;
												height:20px;
												background:url(../img/buy.png) no-repeat;
												background-size:cover;
												@media(max-width:400px){
													width:16px;
													height:14px;
													background-size:cover;
												}
											}
										}
										.txt{
											margin:0 6px;
											@include fz(16px,44px);
											color:$color;
											transition:color 0.3s;
											vertical-align: middle;
											@media(max-width:1200px){
												line-height:40px;
											}
											@media(max-width:850px){
												@include fz(14px,40px);
												margin:0 3px;
											}
											@media(max-width:400px){
												@include fz(13px,36px);
											}
										}
										i{
											transition:background 0.3s;
											display: inline-block;
											vertical-align: middle;
											width:20px;
											height:20px;
											margin:0 6px;
											background:url(../img/in2.png) no-repeat;
											background-size:cover;
											@media(max-width:850px){
												margin:0 3px;
											}
											@media(max-width:400px){
												width:14px;
												height:14px;
											}
										}
									}
								}
							}
						}
					}
				}
			}

		}
		.hot_nav{
			width:100%;
			height:140px;
			border-bottom:1px solid #e1e1e1;
			box-sizing:border-box;
			position:relative;
			@media(max-width:1024px){
				height:110px;
			}
			@media(max-width:850px){
				height: auto;
				border:none;
				padding-top:40px;
			}
			@media(max-width:600px){
				padding-top:25px;
			}
			.bg{
				position:absolute;
				width:27%;
				height:100%;
				left:0;
				top:0;
				background: #f0f0f0;
				@media(max-width:850px){
					display: none;
				}
			}
			.hot_cen{
				position:relative;
				z-index:10;
				height:100%;
				.tit{
					float:left;
					width:13.8%;
					height:100%;
					background:url(../img/btnr.png) no-repeat right center;
					padding-right:30px;
					box-sizing:border-box;
					@media(max-width:1200px){
						width:18%;
					}
					@media(max-width:850px){
						width:100%;
						float:none;
						text-align: center;
						background:none;
						padding-right:0;
					}	
					.tab{
						width:100%;
						height:100%;
						display:table;
						.tab_cell{
							display: table-cell;
							vertical-align: middle;
							.dib{
								width:100%;
								display: inline-block;
								.cn{
									@include fz(28px,36px);
									color:#333;
									@media(max-width:1200px){
										@include fz(24px,32px);
									}
									@media(max-width:750px){
										@include fz(20px,26px);
									}
								}
								.en{
									@include fz(12px,20px);
									color:#999;
									text-transform:uppercase;
									font-family: "Roboto";
								}
							}
							
						}
					}
				}
				.list{
					width:73.8%;
					float:right;
					height:100%;
					@media(max-width:850px){
						display: none;
					}
					ul{
						height:100%;
						@media(max-width:650px){
							text-align: center;
							font-size:0;
						}
						li{
							width:20%;
							height:100%;
							float:left;
							padding:0 10px;
							box-sizing:border-box;
							position:relative;
							@media(max-width:650px){
								width:33.33%;
								float:none;
								display: inline-block;
								vertical-align: top;
								padding:0 5px;
							}
							&:last-child{
								&::before{
									display: none;
								}
							}
							&::before{
								content:'';
								position:absolute;
								width:1px;
								height:80px;
								background: #eee;
								right:0;
								top:50%;
								margin-top:-40px;
								@media(max-width:1024px){
									height: 60px;
									margin-top:-30px;
								}
								@media(max-width:850px){
									display: none;
								}
							}
							&.active{
								&::after{
									transform:scaleX(1);
									transform-origin:left center;
								}
								a{
									.ico img{
										@include opacity(0);
										&.active{
											@include opacity(1);
										}
									}
									.txt{
										color:#ed6d01;
									}
								}
							}
							@media(min-width:1024px){
								&:hover{
									&::after{
										transform:scaleX(1);
										transform-origin:left center;
									}
									a{
										.ico img{
											@include opacity(0);
											&.active{
												@include opacity(1);
											}
										}
										.txt{
											color:#ed6d01;
										}
									}
								}
							}
							&::after{
								content:'';
								position:absolute;
								left:35px;
								right:35px;
								bottom:0;
								height:3px;
								transition:transform 0.38s cubic-bezier(0.4, 0, 0.2, 1);
								transform:scaleX(0);
								background: #ed6d01;
								transform-origin:right center;
								@media(max-width:1200px){
									left:20px;
									right:20px;
								}
								@media(max-width:850px){
									display: none;
								}
							}
							a{
								display: block;
								padding-top:28px;
								@media(max-width:1024px){
									padding-top:20px;
								}
								@media(max-width:500px){
									padding-top:0px;
									margin-top:15px;
								}
								.ico{
									width:78px;
									height:55px;
									margin:0 auto;
									position:relative;
									img{
										position:absolute;
										left:0;
										top:0;
										transition:opacity 0.38s cubic-bezier(0.4, 0, 0.2, 1);
										width:100%;
										height: auto;
										&.active{
											@include opacity(0);
										}
									}
									@media(max-width:1200px){
										height:50px;
										width:71px;
									}
									@media(max-width:1024px){
										height:40px;
										width:57px;
									}
									@media(max-width:600px){
										height:30px;
										width:43px;
									}
								}
								.txt{
									@include fz(16px,20px);
									color:#666;
									text-align: center;
									transition:color 0.38s cubic-bezier(0.4, 0, 0.2, 1);
									margin-top:12px;
									@media(max-width:1024px){
										@include fz(15px,20px);
										margin-top:6px;
									}
									@media(max-width:600px){
										@include fz(14px,20px);
									}
								}
							}
							
						}
					}
				}
				.swiper_list{
					display: none;
					position:relative;
					margin-top:30px;
					@media(max-width:850px){
						display: block;
					}
					@media(max-width:500px){
						margin-top:20px;
					}
					.swiper-button-prev{
						width:30px;
						height:30px;
						position:absolute;
						left:0;
						top:50%;
						margin-top:-15px;
						background:url(../img/prev.png) no-repeat;
						background-size:cover !important;
						@media(max-width:500px){
							width:20px;
							height:20px;
							margin-top:-10px;
							left:-10px;
						}
					}
					.swiper-button-next{
						width:30px;
						height:30px;
						position:absolute;
						right:0;
						top:50%;
						margin-top:-15px;
						background:url(../img/next.png) no-repeat;
						background-size:cover !important;
						@media(max-width:500px){
							width:20px;
							height:20px;
							margin-top:-10px;
							right:-10px;
						}
					}
					.swiper-container{
						width:90%;
						margin:0 auto;
						@media(max-width:600px){
							width:88%;
						}
						.swiper-wrapper{
							.swiper-slide{
								&.active{
									a{
										.ico img{
											@include opacity(0);
											&.active{
												@include opacity(1);
											}
										}
										.txt{
											color:#ed6d01;
										}
									}
								}
								a{
									display: block;
									.ico{
										height:50px;
										width:71px;
										position:relative;
										margin:0 auto;
										img{
											position:absolute;
											width:100%;
											height:auto;
											left:0;
											top:0;
											&.active{
												@include opacity(0);
											}
										}
										@media(max-width:500px){
											width:43px;
											height:30px;
										}
									}
									.txt{
										@include fz(16px,24px);
										color:#666;
										text-align: center;
										margin-top:10px;
										@media(max-width:500px){
											@include fz(12px,20px);
											margin-top:5px;
										}
									}
								}
							}
						}
					}
				}
			}
		}
		.detail{
			.detail_top{
				padding-top:55px;
				padding-bottom:42px;
				background-color: #efe7dd;
				@media(max-width:1024px){
					padding:45px 0;
				}
				@media(max-width:500px){
					padding:25px 0;
				}
				.detail_top_cen{
					position:relative;
					.prev{
						width:50px;
						cursor:pointer;
						height:50px;
						position:absolute;
						left:0;
						top:50%;
						margin-top:-25px;
						background:url(../img/pl.png) no-repeat center center #fff;
						box-shadow: 0 5px 20px rgba(156,156,156,.24);
						border-radius:50%;
						@media(max-width:1200px){
							width:40px;
							height: 40px;
							margin-top:-20px;
						}
						@media(max-width:700px){
							width:30px;
							height:30px;
							margin-top:-15px;
							background-size:24% auto;
						}
					}
					.next{
						width:50px;
						height:50px;
						position:absolute;
						right:0;
						cursor:pointer;
						top:50%;
						margin-top:-25px;
						background:url(../img/pr.png) no-repeat center center #fff;
						box-shadow: 0 5px 20px rgba(156,156,156,.24);
						border-radius:50%;
						@media(max-width:1200px){
							width:40px;
							height: 40px;
							margin-top:-20px;
						}
						@media(max-width:700px){
							width:30px;
							height:30px;
							margin-top:-15px;
							background-size:24% auto;
						}
					}
					.pro_swiper{
						width:88.88%;
						margin:0 auto;
						@media(max-width:500px){
							width:84%;
						}
						.swiper-wrapper{
							.swiper-slide{
								&.auto{
									height: auto !important;
								}
								.swiper_left{
									width:56.25%;
									float:left;
									@media(max-width:1024px){
										width:55%;
									}
									@media(max-width:950px){
										width:100%;
										float:none;
									}
									.swiper-container{
										.pagination{
											width:100%;
											margin-top:10px;
											font-size:0;
											text-align: center;
											span{
												margin:0 10px;
												display: inline-block;
												width:10px;
												height:10px;
												cursor:pointer;
												border-radius:50%;
												background: #fff;
												&.swiper-active-switch{
													background:#c8a063;
												}
											}
											@media(max-width:500px){
												span{
													margin:0 5px;
													width:8px;
													height: 8px;
												}
											}
										}
										.swiper-wrapper{
											.swiper-slide{
												overflow: hidden;
												position:relative;
												img{
													position:absolute;
													left:0;
													top:0;
													right:0;
													bottom:0;
													max-width:100%;
													max-height:100%;
													margin:auto;
												}
											}
										}
									}
								}
								.text_box{
									float:right;
									padding-top:18px;
									width:39.4%;
									@media(max-width:1200px){
										padding-top:0;
									}
									@media(max-width:1024px){
										width:42%;
									}
									@media(max-width:950px){
										width:100%;
										margin-top:20px;
										float:none;
									}
									.t{
										@include fz(36px,50px);
										color:#333;
										@media(max-width:1460px){
											@include fz(30px,40px);
										}
										@media(max-width:1024px){
											@include fz(26px,36px);
										}
										@media(max-width:750px){
											@include fz(24px,36px);
										}
									}
									.ds{
										@include fz(18px,34px);
										color:#333;
										@media(max-width:1200px){
											@include fz(16px,30px);
										}
										@media(max-width:500px){
											@include fz(14px,24px);
										}
									}
									.money{
										@include fz(32px,36px);
										color:$color;
										font-family:Arial;
										font-weight:bold;
										margin-top:12px;
										@media(max-width:1200px){
											@include fz(28px,30px);
										}
										span{
											font-size:20px;
											line-height:30px;
											display: inline-block;
											vertical-align: middle;
											margin-right:4px;
										}
										@media(max-width:950px){
											@include fz(24px,30px);
											margin-top:8px;
											span{
												@include fz(18px,24px);
											}
										}
										@media(max-width:500px){
											@include fz(18px,24px);
											margin-top:5px;
											span{
												@include fz(16px,20px);
											}
										}
									}
									.buy{
										width:180px;
										height:44px;
										background:$color;
										@include fz(16px,44px);
										color:#fff;
										text-align: center;
										display: block;	
										margin-top:55px;
										@media(max-width:1200px){
											margin-top:35px;
										}
										@media(max-width:950px){
											width:120px;
											height:40px;
											line-height:40px;
										}
										@media(max-width:500px){
											margin-top:15px;
											font-size:14px;
											width:100px;
										}
									}
									.specifications{
										width:360px;
										margin-top:10px;
										box-sizing:border-box;
										padding-left:70px;
										position:relative;
										@media(max-width:950px){
											width:100%;
										}
										@media(max-width:500px){
											padding-left: 0;
											display: none;
										}
										.text{
											@include fz(14px,44px);
											color:#666;
											position:absolute;
											left:0;
											top:0;
											margin-top:10px;
											@media(max-width:1200px){
												line-height:40px;
											}
											@media(max-width:500px){
												line-height:30px;
												position:static;
											}
										}
										.box{
											ul{
												li{
													width:60px;
													cursor:pointer;
													height:44px;
													text-align: center;
													border:1px solid #ccc;
													background: #f6f1eb;
													margin-top:10px;
													float:left;
													margin-right:8px;
													transition:all 0.3s;
													box-sizing:border-box;
													@include fz(14px,44px);
													color:#666;
													&.active{
														background: #fff;
														border-color:$color;
													}
													@media(max-width:1200px){
														line-height:40px;
														height: 40px;
													}
													@media(min-width:1024px){
														&:hover{
															background: #fff;
															border-color:$color;
														}
													}
													
												}
											}
										}
									}
									.choose{
										width:360px;
										box-sizing:border-box;
										padding-left:70px;
										position:relative;
										@media(max-width:1200px){
											width:300px;
										}
										@media(max-width:950px){
											width:100%;
										}
										@media(max-width:500px){
											padding-left: 0;
											display: none;
										}
										.text{
											@include fz(14px,44px);
											color:#666;
											position:absolute;
											left:0;
											margin-top:10px;
											top:0;
											@media(max-width:1200px){
												line-height:40px;
											}
											@media(max-width:500px){
												line-height:30px;
												position:static;
											}
										}
										.choose_box{
											ul{
												li{
													width:140px;
													cursor:pointer;
													height:44px;
													text-align: center;
													border:1px solid #ccc;
													background: #f6f1eb;
													margin-top:10px;
													padding:0 15px;
													float:left;
													transition:border 0.3s,background 0.3s;
													box-sizing:border-box;
													@media(max-width:1200px){
														width:110px;
														height: 40px;
														padding:0 10px;
													}
													&:nth-child(even){
														float: right;
													}
													@media(max-width:950px){
														margin-right:10px;
														&:nth-child(even){
															float: left;
														}
													}
													&.active{
														background: #fff;
														border-color:$color;
													}
													@media(min-width:1024px){
														&:hover{
															background: #fff;
															border-color:$color;
														}
													}
													.pic{
														float:left;
														width:50px;
														height:100%;
														text-align:left;
														position:relative;
														line-height:42px;
														img{
															position:absolute;
															left:0;
															top:0;
															right:0;
															bottom:0;
															max-width:100%;
															max-height:90%;
															margin:auto;
															margin-left:0;
														}
														@media(max-width:1200px){
															width: 40px;
														}
													}
													.color{
														float: right;
														@include fz(14px,44px);
														color:#666;
														@media(max-width:1200px){
															line-height:40px;
														}
													}
												}
											}
										}
									}
								}
							}
						}

					}
				}
			}
			.pd{
				.position{
					background: #fff;
					border-bottom:1px solid #e1e1e1;
					&.fix{
						position:fixed;
						left:0;
						top:0;
						z-index:880;
						width:100%;
					}
					.position_cen{
						.nav_l{
							float:left;
							font-size:0;
							@media(max-width:400px){
								width:100%;
							}
							a{
								display: inline-block;
								width:160px;
								height:72px;
								@include fz(16px,72px);
								color:#333;
								text-align: center;
								position:relative;
								transition:color 0.38s cubic-bezier(0.4, 0, 0.2, 1);
								@media(max-width:1200px){
									line-height:60px;
									height: 60px;
								}
								@media(max-width:600px){
									padding:0 20px;
									width:auto;
									@include fz(16px,50px);
									height: 50px;
								}
								@media(max-width:400px){
									width:33.33%;
									padding:0;
									@include fz(14px,40px);
									height: 40px;
								}
								span{
									display: block;
									width:100%;
									height:100%;
									position:relative;
									z-index:20;
								}
								&::after{
									content:'';
									position:absolute;
									left:0;
									bottom:-1px;
									width:100%;
									top:0;
									transition:transform 0.38s cubic-bezier(0.4, 0, 0.2, 1);
									background:$color;
									transform:scaleX(0);
									transform-origin:right center;
								}
								&.active{
									color:#fff;
									&::after{
										transform:scaleX(1);
										transform-origin:left center;
									}
								}
								@media(min-width:1024px){
									&:hover{
										color:#fff;
										&::after{
											transform:scaleX(1);
											transform-origin:left center;
										}
									}
								}
							}
						}
						.position_r{
							float:right;
							@include fz(14px,72px);
							color:#999;
							@media(max-width:1024px){
								display:none;
							}
							a{
								transition:color 0.3s;
								color:#999;
								@media(min-width:1024px){
									&:hover{
										color:$color;
									}
								}
							}
							span{
								color:$color;
							}
						}
					}
				}
				.parameter{
					padding-bottom:110px;
					padding-top:100px;
					@media(max-width:1024px){
						padding-top:70px;
						padding-bottom:80px;
					}
					@media(max-width:600px){
						padding-top:30px;
						padding-bottom:35px;
					}
					.tit{
						padding-bottom:25px;
						border-bottom:1px solid #e1e1e1;
						@media(max-width:1024px){
							padding-bottom:15px;
						}
						.cn{
							display: inline-block;
							@include fz(28px,36px);
							color:#333;
							vertical-align: middle;
							position:relative;
							@media(max-width:1300px){
								@include fz(24px,32px);
							}
							@media(max-width:600px){
								@include fz(20px,28px);
							}
							&::after{
								content:'';
								position:absoltue;
								width:100%;
								height:3px;
								background:$color;
								position:absolute;
								bottom:-27px;
								left:0;
								@media(max-width:1024px){
									bottom:-17px;
								}
							}
						}
						.en{
							@include fz(16px,20px);
							color:#999;
							font-family: "Roboto";
							display: inline-block;
							vertical-align: bottom;
							margin-left:12px;
							text-transform:uppercase;
							@media(max-width:1024px){
								@include fz(15px,22px);
							}
							@media(max-width:750px){
								@include fz(12px,20px);
							}
						}
					}
					.table{
						margin-top:50px;
						@media(max-width:600px){
							margin-top:30px;
						}
						table{
							width:100%;
							tr{
								&:nth-child(odd){
									background: #f6f6f6;
								}
								td{
									border:1px solid #e1e1e1;
									padding:15px 70px;
									@include fz(16px,30px);
									color:#333;
									@media(max-width:1024px){
										@include fz(14px,24px);
										padding:15px 40px;
									}
									@media(max-width:600px){
										padding:15px;
										@include fz(13px,20px);
									}
								}
							}
						}
					}
				}
				.other{
					padding-top:80px;
					padding-bottom:120px;
					@media(max-width:1024px){
						padding-top:50px;
						padding-bottom:80px;
					}
					@media(max-width:600px){
						padding-top:30px;
						padding-bottom:40px;
					}
					.other_cen{
						.tbox{
							padding:30px;
							background: #fff;
							@media(max-width:850px){
								padding:20px;
							}
							.top{
								padding-bottom:12px;
								border-bottom:1px solid #e1e1e1;
								.t{
									float:left;
									@include fz(24px,36px);
									color:#333;
									@media(max-width:1300px){
										@include fz(20px,30px);
									}
									@media(max-width:500px){
										@include fz(18px,30px);
									}
								}
								.btn_box{
									float: right;
									display: none;
									div{
										width:30px;
										height:30px;
										border-radius:50%;
										float:left;
										cursor:pointer;
										margin-left:10px;
										transition:background 0.5s;
										@media(max-width:600px){
											width:24px;
											height: 24px;
											margin-left:5px;
											margin-top:3px;
										}
										&.prev{
											background:url(../img/pl2.png) no-repeat center center #ccc;
											background-size:24% auto;
											@media(min-width:1024px){
												&:hover{
													background:url(../img/pl2.png) no-repeat center center $color;
												background-size:24% auto;
												}
											}
										}
										&.next{
											background:url(../img/pr2.png) no-repeat center center #ccc;
											background-size:24% auto;
											@media(min-width:1024px){
												&:hover{
													background:url(../img/pr2.png) no-repeat center center $color;
												background-size:24% auto;
												}
											}
										}
									}
								}
							}
							
							.item_box{
								margin-top:50px;
								@media(max-width:500px){
									margin-top:24px;
								}
								.owl-item:last-child a{
									.pic{
										border:none;
									}
								}
								a{
									@media(min-width:1024px){
										&:hover{
											.pic{
												img{
													transform:scale(1.05);
												}
											}
										}
									}
									.pic{
										height: 284px;
										position:relative;
										border-right:1px solid #e1e1e1;
										overflow: hidden;
										@media(max-width:600px){
											border:none;
										}
										img{
											position:absolute;
											left:0;
											top:0;
											right:0;
											bottom:0;
											margin:auto;
											transition:transform 0.5s ease-in-out;
											max-width:100%;
											max-height:100%;
										}
									}
									.cont{
										padding:0 10px;
										text-align: center;
										.tit{
											@include fz(20px,40px);
											color:#333;
											@extend .ellipsis;
											@media(max-width:1300px){
												@include fz(18px,30px);
											}
											@media(max-width:600px){
												@include fz(16px,24px);
												margin-top:3px;
											}
										}
										.ds{
											@include fz(14px,26px);
											color:#666;
											@extend .ellipsis;
											@media(max-width:600px){
												@include fz(13px,20px);
											}
										}
									}
								}
							}
						}
						.service_box{
							margin-top:58px;
							@media(max-width:1200px){
								margin-top:55px;
							}
							@media(max-width:1024px){
								margin-top:40px;
							}
							@media(max-width:600px){
								margin-top:20px;
							}
						}
						.problem_box{
							position:relative;
							margin-top:58px;
							@media(max-width:1200px){
								margin-top:55px;
							}
							@media(max-width:1024px){
								margin-top:40px;
							}
							@media(max-width:600px){
								margin-top:20px;
							}

							.problem_l{
								width:64.1%;
								background: #fff;
								position:absolute;
								left:0;
								top:0;
								height:100%;
								box-shadow: 0 5px 40px rgba(142,142,142,.1);
								padding:0 2.9%;
								box-sizing:border-box;
								@media(max-width:850px){
									position:static;
									height:auto;
									width:100%;
									padding:20px;
								}
								.t{
									@include fz(24px,36px);
									color:#333;
									margin-top:30px;
									a{
										display: block;
										color:#333;
										transition:all 0.5s;
										@media(min-width:1024px){
											&:hover{
												color:$color;
											}
										}
									}
									@media(max-width:1300px){
										@include fz(20px,32px);
										margin-top:20px;
									}
									@media(max-width:850px){
										margin-top:0;
									}
									@media(max-width:600px){
										@include fz(18px,28px);
									}
								}
								.list{
									margin-top:17px;
									@media(max-width:850px){
										margin-top:10px;
										padding-bottom:20px;
									}
									@media(max-width:600px){
										margin-top:0;
									}
									ul{
										li{
											border-bottom:1px solid #ddd;
											&.active{
												.ti{
													&::after{
														transform:rotate(135deg);
													}
												}
											}

											.ti{	
												@include fz(16px,24px);
												color:#333;
												padding-right:23px;
												cursor:pointer;
												position:relative;
												height:56px;
												@media(max-width:850px){
													height: auto;
													@include fz(15px,24px);
													padding:15px 0;
													padding-right:20px;
												}
												&::after{
													content:'';
													position:absolute;
													display: block;
													width:14px;
													height:14px;
													background:url(../img/icon_close.png) no-repeat;
													right:8px;
													top:50%;
													margin-top:-7px;
													transition:transform 0.3s ease-out;
													@media(max-width:850px){
														right:0;
													}
												}
												.tab{
													width:100%;
													height:100%;
													display:table;
													@media(max-width:850px){
														display: block;
													}
													.tab_cell{
														display: table-cell;
														vertical-align: middle;
														@media(max-width:850px){
															display: block;
														}
													}
												}
											}
											.con{
												@include fz(14px,28px);
												color:#666;
												display: none;
												padding-bottom:24px;
												@media(max-width:1300px){
													padding-bottom:15px;
												}
												.mCSB_container{
													margin-right:10px;
												}
												&.show{
													display: block;
												}
												@media(max-width:850px){
													@inlcude fz(14px,24px);
													max-height:none !important;
												}
											}
										}
									}
								}
							}
							.links{
								float:right;
								width:33.5%;
								@media(max-width:850px){
									width:100%;
									float:none;
								}
								ul{
									li{
										height:234px;
										padding-top:38px;
										box-sizing:border-box;
										width:100%;
										position:relative;
										cursor:pointer;
										box-shadow: 0 5px 40px rgba(142,142,142,.1);
										@media(max-width:1300px){
											height:200px;
											padding-top:30px;
										}
										&:nth-child(even){
											margin-top:7.5%;
											a{
												.tit{
													.cn,.en{
														color:#fff;
													}
												}
											}
										}
										@media(max-width:850px){
											height:180px;
											margin-top:20px !important;
										}
										@media(max-width:600px){
											height:130px;
										}
										.mask{
											position:absolute;
											left:0;
											top:0;
											width:100%;
											height:100%;
											background:rgba(#000,0.5);
										}
										.txt{
											position:absolute;
											bottom:10px;
											width:100%;
											@include fz(18px,30px);
											color:#fff;
											text-align: center;
											z-index:20;
											padding:0 10px;
											box-sizing:border-box;
											@extend .ellipsis;
											@media(max-width:500px){
												@include fz(15px,20px);
												bottom:5px;
											}
										}
										.play{
											width:72px;
											height:72px;
											background:url(../img/play3.png) no-repeat center center;
											position:absolute;
											left:50%;
											margin-left:-36px;
											top:50%;
											margin-top:-36px;
											background-size:cover;
											z-index:20;
											@media(max-width:1200px){
												width:60px;
												height:60px;
												margin-top:-30px;
												margin-left:-30px;
											}
											@media(max-width:600px){
												width:50px;
												height:50px;
												margin-top:-25px;
												margin-left:-25px;
											}
										}
										// a{
										// 	display: block;
										// 	padding:0 8.6%;
										// 	height:100%;
										// 	@media(max-width:850px){
										// 		padding:0 4%;
										// 	}
										// 	@media(min-width:1024px){
										// 		&:hover{
										// 			.tit{
										// 				transform:translateY(23%);
										// 			}
										// 		}
										// 	}
										// 	.tit{
										// 		transition:transform 0.5s ease;
										// 		.cn{
										// 			@include fz(24px,40px);
										// 			color:#222;
										// 			font-weight:bold;
										// 			@media(max-width:1300px){
										// 				@include fz(20px,36px);
										// 			}
										// 			@media(max-width:600px){
										// 				@include fz(18px,28px);
										// 			}
										// 		}
										// 		.en{
										// 			color:#222;
										// 			text-transform:uppercase;
										// 			font-family: "Roboto";
										// 			@include fz(18px,30px);
										// 			@media(max-width:600px){
										// 				@include fz(13px,20px);
										// 			}
										// 		}
										// 		.ico{
										// 			margin-top:9px;
										// 			@media(max-width:600px){
										// 				margin-top:3px;
										// 				img{
										// 					height:16px;
										// 				}
										// 			}
										// 		}
										// 	}
										// }
									}
								}
								
							}
						}
					}
				}
				.dbox{
					padding-top:80px;
					@media(max-width:1024px){
						padding-top:50px;
					}
					@media(max-width:600px){
						padding-top:30px;
					}
					.pic_box{
						img{
							max-width:100%;
							height: auto !important;
						}
					}
				}
			}
		}
		.container{
			padding-top:95px;
			padding-bottom:120px;
			@media(max-width:1200px){
				padding-top:80px;
				padding-bottom:100px;
			}
			@media(max-width:1024px){
				padding:60px 0;
			}
			@media(max-width:600px){
				padding:30px 0;
			}
			.container_top{
				.title{
					.cn{
						color:#333;
					}
					.en{
						color:#999;
					}
				}
				.ds{
					@include fz(16px,28px);
					color:#666;
					margin-top:20px;
					text-align: center;
					@media(max-width:1024px){
						@include fz(14px,24px);
						margin-top:15px;
					}
					@media(max-width:500px){
						margin-top:10px;
					}
				}
			}
			.page{
				position:relative;
				margin-top:32px;
				padding-right:180px;
				margin-bottom:20px;
				@media(max-width:650px){
					padding-right:110px;
					margin-top:20px;
					margin-bottom:10px;
				}
				.page_l{
					
					p{
						@include fz(14px,28px);
						color:#666;
						text-align: left;
						@extend .ellipsis;
						a{
							color:#666;
							transition:color 0.3s;
							@media(min-width:1024px){
								&:hover{
									color:$color;
								}
								
							}
						}
					}
				}
				.return{
					width:160px;
					height:42px;
					background:$color;
					border-radius:21px;
					@include fz(16px,42px);
					color:#fff;
					text-align: center;
					display: block;
					position:absolute;
					right:0;
					top:50%;
					margin-top:-21px;
					@media(max-width:650px){
						width:100px;
						height:36px;
						@include fz(14px,36px);
						border-radius:18px;
					}
				}
			}
			.content{
				background: #fff;
				padding:60px;
				box-shadow: 0 5px 40px rgba(142,142,142,.1);
				margin-top:42px;
				@media(max-width:1024px){
					padding:30px;
				}
				@media(max-width:600px){
					padding:20px;
				}
				.tit{
					margin-top:13px;
					text-align: center;
					@media(max-width:600px){
						margin-top:0;
					}
					.t{
						@include fz(28px,40px);
						color:$color;
						font-weight:bold;
						@media(max-width:1460px){
							@include fz(24px,36px);
						}
						@media(max-width:750px){
							@include fz(20px,30px);
						}
					}
					.line{
						width:60px;
						height:4px;
						background:$color;
						margin-top:20px;
						margin-left:auto;
						margin-right:auto;
						@media(max-width:800px){
							width:30px;
							margin-top:10px;
							height: 2px;
						}
					}
				}
				.case{
					margin-top:40px;
					@media(max-width:600px){
						margin-top:25px;
					}
					.ti{
						padding-bottom:15px;
						border-bottom:1px solid #e1e1e1;
						@media(max-width:1024px){
							padding-bottom:15px;
						}
						.cn{
							display: inline-block;
							@include fz(24px,32px);
							color:#333;
							vertical-align: middle;
							position:relative;
							@media(max-width:1460px){
								@include fz(20px,28px);
							}
							@media(max-width:600px){
								@include fz(18px,28px);
							}
							&::after{
								content:'';
								position:absoltue;
								width:100%;
								height:3px;
								background:$color;
								position:absolute;
								bottom:-17px;
								left:0;
								@media(max-width:1024px){
									bottom:-17px;
								}
							}
						}
						.en{
							@include fz(14px,20px);
							color:#999;
							font-family: "Roboto";
							display: inline-block;
							vertical-align: bottom;
							margin-left:12px;
							text-transform:uppercase;
							@media(max-width:750px){
								margin-left:5px;
								@include fz(12px,20px);
							}
						}
					}
					.case_list{
						padding-top:30px;
						padding-bottom:80px;
						border-bottom:1px solid #e1e1e1;
						@media(max-wdith:800px){
							padding-bottom:60px;
						}
						@media(max-width:600px){
							padding-top:10px;
							padding-bottom:30px;
						}
						.more{
							margin-top:50px;
							width:66px;
							height:66px;
							border-radius:50%;
							background:url(../img/j5.png) no-repeat center center $color;
							margin-left:auto;
							margin-right:auto;
							cursor:pointer;
							transition:transform 0.5s;
							@media(min-width:1024px){
								&:hover{
									transform:rotate(180deg);
								}
							}
							@media(max-width:800px){
								width:50px;
								height: 50px;
								margin-top:30px;
								background-size:40% auto;
							}
							@media(max-width:500px){
								width:36px;
								margin-top:20px;
								height: 36px;
								background-size:40% auto;
							}
						}
						ul{
							li{
								margin-top:20px;
								background: #f6f6f6;
								position:relative;
								&:nth-child(even){
									.pic{
										float: right;	
									}
									.cont{
										right:auto;
										left:0;
									}
								}
								@media(min-width:1024px){
									&:hover{
										.pic{
											img{
												transform:scale(1.05);
											}
										}
									}
								}
								.pic{
									width:50%;
									float:left;
									overflow: hidden;
									img{
										transition:all 0.5s ease-in-out;
										width:100%;
										height:auto;
									}
									@media(max-width:1024px){
										width:100%;
										float:none !important;
									}
								}
								.cont{
									position:absolute;
									width:50%;
									height:100%;
									right:0;
									top:0;
									padding:0 4.1%;
									box-sizing:border-box;
									@media(max-width:1024px){
										height:auto;
										padding:30px 4.1%;
										position:static;
										width:100%;
										box-sizing:border-box;
									}
									@media(max-width:600px){
										padding:20px;
									}
									.t{
										@include fz(22px,32px);
										color:#333;
										margin-bottom:20px;
										padding-top:8.3%;
										@media(max-width:1024px){
											@include fz(18px,28px);
											margin-bottom:15px;
										}
										@media(max-width:1024px){
											padding-top:0;
										}
									}
									.con_box{
										@media(max-width:1024px){
											max-height:inherit !important;
										}
										.msg{
											padding-bottom:25px;
											background:url(../img/line5.png) no-repeat center bottom;
											background-size:100% 1px;
											@media(max-width:600px){
												padding-bottom:15px;
											}
											span{
												display: block;
												width:25%;
												float:left;
												@include fz(14px,30px);
												color:#666;
												@media(max-width:1420px){
													width:33.33%;
													line-height:24px;
												}
												@media(max-width:1200px){
													width:50%;
												}
												
											}	
										}
										.con{
											margin-top:35px;
											@media(max-width:1300px){
												margin-top:20px;
											}
											@media(max-width:600px){
												margin-top:15px;
											}
											.case_tit{
												@include fz(18px,18px);
												color:$color;
												font-weight:bold;
												padding-left: 14px;
												border-left:4px solid $color;
												@media(max-width:1024px){
													@include fz(16px,16px);
												}
											}
											.des{
												@include fz(14px,26px);
												color:#666;
												margin-top: 15px;
												@media(max-width:1024px){
													@include fz(13px,20px);
													margin-top:10px;
												}
											}
										}
									}
								}
							}
						}
					}
				}
				.explain{
					margin-top:42px;
					@media(max-width:600px){
						margin-top:25px;
					}
					.ti{
						padding-bottom:15px;
						border-bottom:1px solid #e1e1e1;
						@media(max-width:1024px){
							padding-bottom:15px;
						}
						.cn{
							display: inline-block;
							@include fz(24px,32px);
							color:#333;
							vertical-align: middle;
							position:relative;
							@media(max-width:1460px){
								@include fz(20px,28px);
							}
							@media(max-width:600px){
								@include fz(18px,28px);
							}
							&::after{
								content:'';
								position:absoltue;
								width:100%;
								height:3px;
								background:$color;
								position:absolute;
								bottom:-17px;
								left:0;
								@media(max-width:1024px){
									bottom:-17px;
								}
							}
						}
						.en{
							@include fz(14px,20px);
							color:#999;
							font-family: "Roboto";
							display: inline-block;
							vertical-align: bottom;
							margin-left:12px;
							text-transform:uppercase;
							@media(max-width:750px){
								margin-left:5px;
								@include fz(12px,20px);
							}
						}
					}
					.list{
						padding-top:12px;
						.read_more{
							display: block;
							width:200px;
							height:50px;
							background: #c8a063;
							border-radius:25px;
							text-align: center;
							font-size:0;
							margin-top:45px;
							margin-left:auto;
							margin-right:auto;
							margin-bottom:40px;
							@media(min-width:1024px){
								&:hover{
									img{
										transform:translate(10px,0);
									}
								}
							}
							@media(max-width:1024px){
								margin-top:30px;
								margin-bottom:30px;
							}
							@media(max-width:600px){
								margin-top:20px;
								margin-bottom:0;
							}
							.txt{
								display: inline-block;
								@include fz(18px,50px);
								color:#fff;
								margin:0 7px;
								vertical-align: middle;
							}
							img{
								margin:0 7px;
								display: inline-block;
								vertical-align: middle;
								transition:transform 0.5s;
							}
							@media(max-width:1024px){
								width:160px;
								height:40px;
								border-radius:20px;
								.txt{
									@include fz(16px,40px);
								}
							}
							@media(max-width:600px){
								width:140px;
								height:40px;
								border-radius:20px;
								.txt{
									@include fz(14px,40px);
								}
							}
						}
						.pic{
							margin-top: 50px;
							text-align: center;
							border:1px solid #666;
							@media(max-width:1024px){
								margin-top:40px;
							}
							@media(max-width:600px){
								margin-top:20px;
							}
							img{
								max-width:100%;
							}
						}
						ul{
							li{
								position:relative;
								padding-left:60px;
								padding-right:10.2%;
								margin-top:28px;
								@media(max-width:600px){
									margin-top:15px;
									padding-left:50px;
									padding-right:0;
								}
								.num{
									width:46px;
									height:46px;
									background:$color;
									border-radius:50%;
									@include fz(20px,46px);
									color:#fff;
									font-weight:bold;
									position:absolute;
									left:0;
									top:0;
									text-align: center;
									@media(max-width:1024px){
										width:40px;
										height:40px;
										@include fz(16px,40px);
									}
								}
								.cont{
									.t{
										@include fz(20px,36px);
										color:#333;
										@media(max-width:1024px){
											@include fz(16px,30px);
										}
									}
									.con{
										@include fz(14px,24px);
										color:#666;
										@media(max-width:1024px){
											@include fz(14px,20px);
										}
									}
								}
							}
						}
					}
				}
			}
		}
	}
	.solution{
		.solution_box{
			padding-bottom:130px;
			@media(max-width:1200px){
				padding-bottom:100px;
			}
			@media(max-width:1024px){
				padding-bottom:60px;
			}
			@media(max-width:600px){
				padding-bottom:30px;
			}
			.title{
				.cn{
					color:#333;
				}
				.en{
					color:#999;
				}
			}
			.ds{
				@include fz(16px,28px);
				color:#666;
				margin-top:20px;
				text-align: center;
				@media(max-width:1024px){
					@include fz(14px,24px);
					margin-top:15px;
				}
				@media(max-width:500px){
					margin-top:10px;
				}
			}
			.cooperation_box{
				margin-top:45px;
				@media(max-width:850px){
					margin-top:0;
				}
				.list_box{
					.tit{
						background-color: #fff;
						box-shadow: 0 5px 40px rgba(142,142,142,.1);
						span{
							@include fz(24px,68px);
							color:#fff;
							padding-left:90px;
							font-weight: bold;
							display: block;
							background:url(../img/bg.jpg) no-repeat left center;
							background-size:auto 100%;
							@media(max-width:1200px){
								@include fz(20px,60px);
							}
							@media(max-width:600px){
								padding-left:40px;
								@include fz(18px,40px);
							}
						}
					}
					.list{
						margin-top:10px;
						
						.more{
							width:200px;
							height:50px;
							border-radius:25px;
							background:$color;
							margin-left:auto;
							margin-right:auto;
							font-size:0;
							cursor:pointer;
							text-align: center;
							.txt{
								display: inline-block;
								vertical-align: middle;
								@include fz(18px,50px);
								color:#fff;
								margin:0 7px;
							}
							img{
								display: inline-block;
								vertical-align: middle;
								margin:0 7px;
							}
							@media(max-width:1024px){
								width:160px;
								height: 40px;
								.txt{
									@include fz(16px,40px);
								}
							}
							@media(max-width:600px){
								width:130px;
								height: 40px;
								.txt{
									margin:0 3px;
									@include fz(14px,40px);
								}
								img{
									margin:0 3px;
								}
							}
						}
						ul{
							width:110%;
							padding-bottom:75px;
							@media(max-width:900px){
								padding-bottom:50px;
							}
							@media(max-width:600px){
								width:100%;
								padding-bottom:30px;
							}
							li{
								float:left;
								background: #fff;
								width:17.55%;
								margin-right:0.8%;
								margin-top:1.3%;
								position:relative;
								@media(min-width:1024px){
									&:hover{
										.line{
											&.line1,&.line3{
												width:100%;
											}
											&.line2,&.line4{
												height:100%;
											}
										}
										.txt{
											color:$color;
										}
									}
								}
								@media(max-width:900px){
									width:29.8%;
								}
								@media(max-width:600px){
									width:48%;
									margin-right:0;
									margin-top:4%;
									&:nth-child(even){
										float: right;
									}
								}
								.line{
									background:$color;
									position:absolute;
									transition:all 0.3s;
									&.line1{
										width:0%;
										height:1px;
										left:0;
										top:0;
									}
									&.line2{
										width:1px;
										height:0%;
										right:0;
										top:0;
									}
									&.line3{
										width:0%;
										height:1px;
										right:0;
										bottom:0;
									}
									&.line4{
										width:1px;
										height:0%;
										left:0;
										bottom:0;
									}
								}
								.logo{
									height:80%;
									position:absolute;
									width:100%;
									left:0;
									top:0;
									img{
										position:absolute;
										left:0;
										top:0;
										right:0;
										bottom:0;
										max-width:90%;
										max-height: 90%;
										margin:auto;
									}
								}
								.txt{
									position:absolute;
									width:100%;
									left:0;
									bottom:20px;
									@include fz(14px,20px);
									color:#666;
									transition:color 0.3s;
									text-align: center;
									@media(max-width:1250px){
										bottom:10px;
									}
									@media(max-width:600px){
										@include fz(13px,20px);
										bottom:5px;
									}
								}
							}
						}
					}
				}
			}
			.solution_top{
				border-bottom:1px solid #e1e1e1;
				&.none{
					border:none;
					padding-bottom:130px;
					background: #fff;
					@media(max-width:1200px){
						padding-bottom:100px;
					}
					@media(max-width:1024px){
						padding-bottom:60px;
					}
					@media(max-width:600px){
						padding-bottom:30px;
					}
					.solution_cen{
						padding-bottom:0;
					}
				}
				&.solution_top2{
					border:none;
				}
				.solution_cen{
					padding-top: 94px;
					@media(max-width:1024px){
						padding-top:70px;;
					}
					@media(max-width:850px){
						padding-bottom:40px;
					}
					@media(max-width:600px){
						padding-top:30px;
						padding-bottom:25px;
					}
					
					.list{
						padding-bottom:35px;
						margin-top:50px;
						@media(max-width:1024px){
							padding-bottom:20px;
						}
						@media(max-width:850px){
							display: none;
						}
						ul{
							height:100%;
							text-align: center;
							font-size:0;
							@media(max-width:650px){
								text-align: center;
								font-size:0;
							}
							li{
								width:210px;
								display: inline-block;
								padding:0 10px;
								box-sizing:border-box;
								position:relative;
								@media(max-width:1200px){
									width:160px;
								}
								@media(max-width:1024px){
									width:130px;
								}
								@media(max-width:650px){
									width:33.33%;
									float:none;
									display: inline-block;
									vertical-align: top;
									padding:0 5px;
								}
								&:last-child{
									&::before{
										display: none;
									}
								}
								&::before{
									content:'';
									position:absolute;
									width:1px;
									height:80px;
									background: #eee;
									right:0;
									top:50%;
									margin-top:-40px;
									@media(max-width:1024px){
										height: 60px;
										margin-top:-30px;
									}
									@media(max-width:850px){
										display: none;
									}
								}
								&.active{
									&::after{
										transform:scaleX(1);
										transform-origin:left center;
									}
									a{
										.ico img{
											@include opacity(0);
											&.active{
												@include opacity(1);
											}
										}
										.txt{
											color:#ed6d01;
										}
									}
								}
								@media(min-width:1024px){
									&:hover{
										&::after{
											transform:scaleX(1);
											transform-origin:left center;
										}
										a{
											.ico img{
												@include opacity(0);
												&.active{
													@include opacity(1);
												}
											}
											.txt{
												color:#ed6d01;
											}
										}
									}
								}
								&::after{
									content:'';
									position:absolute;
									left:40px;
									right:40px;
									bottom:-35px;
									height:3px;
									transition:transform 0.38s cubic-bezier(0.4, 0, 0.2, 1);
									transform:scaleX(0);
									background: #ed6d01;
									transform-origin:right center;
									@media(max-width:1200px){
										left:20px;
										right:20px;
									}
									@media(max-width:1024px){
										bottom:-20px;
									}
									@media(max-width:850px){
										display: none;
									}
								}
								a{
									display: block;
									.ico{
										width:78px;
										height:55px;
										margin:0 auto;
										position:relative;
										img{
											position:absolute;
											left:0;
											top:0;
											transition:opacity 0.38s cubic-bezier(0.4, 0, 0.2, 1);
											width:100%;
											height: auto;
											&.active{
												@include opacity(0);
											}
										}
										@media(max-width:1200px){
											height:50px;
											width:71px;
										}
										@media(max-width:1024px){
											height:40px;
											width:57px;
										}
										@media(max-width:600px){
											height:30px;
											width:43px;
										}
									}
									.txt{
										@include fz(16px,20px);
										color:#666;
										text-align: center;
										transition:color 0.38s cubic-bezier(0.4, 0, 0.2, 1);
										margin-top:12px;
										@media(max-width:1024px){
											@include fz(15px,20px);
											margin-top:6px;
										}
										@media(max-width:600px){
											@include fz(14px,20px);
										}
									}
								}
								
							}
						}
					}
					.swiper_list{
						display: none;
						position:relative;
						margin-top:30px;
						@media(max-width:850px){
							display: block;
						}
						@media(max-width:500px){
							margin-top:20px;
						}
						.swiper-button-prev{
							width:30px;
							height:30px;
							position:absolute;
							left:0;
							top:50%;
							margin-top:-15px;
							background:url(../img/prev.png) no-repeat;
							background-size:cover !important;
							@media(max-width:500px){
								width:20px;
								height:20px;
								margin-top:-10px;
								left:-10px;
							}
						}
						.swiper-button-next{
							width:30px;
							height:30px;
							position:absolute;
							right:0;
							top:50%;
							margin-top:-15px;
							background:url(../img/next.png) no-repeat;
							background-size:cover !important;
							@media(max-width:500px){
								width:20px;
								height:20px;
								margin-top:-10px;
								right:-10px;
							}
						}
						.swiper-container{
							width:90%;
							margin:0 auto;
							@media(max-width:600px){
								width:88%;
							}
							.swiper-wrapper{
								.swiper-slide{
									&.active{
										a{
											.ico img{
												@include opacity(0);
												&.active{
													@include opacity(1);
												}
											}
											.txt{
												color:#ed6d01;
											}
										}
									}
									a{
										display: block;
										.ico{
											height:50px;
											width:71px;
											position:relative;
											margin:0 auto;
											img{
												position:absolute;
												width:100%;
												height:auto;
												left:0;
												top:0;
												&.active{
													@include opacity(0);
												}
											}
											@media(max-width:500px){
												width:43px;
												height:30px;
											}
										}
										.txt{
											@include fz(16px,24px);
											color:#666;
											text-align: center;
											margin-top:10px;
											@media(max-width:500px){
												@include fz(12px,20px);
												margin-top:5px;
											}
										}
									}
								}
							}
						}
					}
				}
			}
			.solution_recommend{
				margin-top:60px;
				@media(max-width:600px){
					margin-top:30px;
				}
				ul{
					li{
						background-color: #fff;
						box-shadow: 0 5px 40px rgba(142,142,142,.1);
						&:nth-child(even){
							a{
								.pic{
									float: right;
								}
								.cont{
									right:auto;
									left:0;
								}
							}
						}
						a{
							display: block;
							position:relative;
							@media(min-width:1024px){
								&:hover{
									.pic{
										img{
											transform:scale(1.05);
										}
									}
								}
							}
							.pic{
								width:50%;
								float:left;
								overflow: hidden;
								img{
									transition:all 0.5s ease-in-out;
									width:100%;
									height:auto;
								}
								@media(max-width:1024px){
									width:100%;
									float:none !important;
								}
							}
							.cont{
								position:absolute;
								right:0;
								top:0;
								width:50%;
								padding:0 4.8%;
								box-sizing:border-box;
								@media(max-width:1024px){
									position:static;
									width:100%;
									padding:30px 4.8%;
								}
								@media(max-width:600px){
									padding:20px;
								}
								.icon{
									position:absolute;
									top:0;
									right:7%;
									display: block;
									width:60px;
									height:72px;
									background:url(../img/tj.png) no-repeat center center;
									@include fz(16px,24px);
									color:#fff;
									text-align: center;
									padding-top:6px;
									box-sizing:border-box;
									@media(max-width:1024px){
										width:50px;
										height:60px;
										background-size:cover;
										@include fz(14px,20px);
										padding-top:6px;
									}
								}
								.t{
									padding-top:11%;
									@include fz(24px,36px);
									color:#333;
									font-weight: bold;
									@media(max-width:1300px){
										@include fz(20px,30px);
										padding-top:35px;
									}
									@media(max-width:1024px){
										padding-top:0;
									}
									@media(max-width:600px){
										@include fz(18px,28px);
									}
								}
								.con{
									@include fz(14px,22px);
									color:#666;
									margin-top:24px;
									min-height:176px;
									@media(max-width:1200px){
										margin-top:15px;
									}
									p{
										padding-left:20px;
										margin-top:14px;
										background:url(../img/d.jpg) no-repeat left center;
									}
									@media(max-width:1150px){
										min-height:132px;
										p{
											margin-top:8px;
										}
									}
									@media(max-width:1024px){
										min-height:inherit;
									}
								}
								.btn{
									width:160px;
									height:44px;
									margin-top:22px;
									background:$color;
									@include fz(14px,44px);
									color:#fff;
									text-align: center;
									@media(max-width:1250px){
										margin-top:10px;
									}
									@media(max-width:1024px){
										width:120px;
										margin-top:20px;
										height: 36px;
										line-height:36px;
									}
								}
							}
						}
					}
				}
			}
			.product_box{
				background-color: #fff;
				box-shadow: 0 5px 40px rgba(142,142,142,.1);
				margin-top:55px;
				padding:10px 30px 70px 30px;
				box-sizing:border-box;
				@media(max-width:600px){
					margin-top:25px;
					padding:10px 20px 30px 20px;
				}
				.page_box{
					padding-top:40px;
					@media(max-width:600px){
						padding-top:20px;
					}
				}
				ul{
					li{
						width:33.33%;
						box-sizing:border-box;
						float:left;
						position:relative;
						padding-top:50px;
						@media(max-width:1024px){
							padding-top:35px;
						}
						@media(max-width:650px){
							width:50%;
							padding-top:15px;
						}
						&::after{
							content:'';
							position:absolute;
							bottom:0;
							left:20px;
							right:-20px;
							height:1px;
							background:#e1e1e1;
							@media(max-width:650px){
								left:10px;
								right:-10px;
							}
						}
	
						&:nth-child(3n){
							&::after{
								right:20px;
							}
							a{
								.pic_box{
									&::after{
										display: none;
									}
								}
							}
						}
						@media(max-width:650px){
							&:nth-child(3n){
								&::after{
									right:-10px;
								}
								a{
									.pic_box{
										&::after{
											display: block;
										}
									}
								}
							}
							&:nth-child(even){
								&::after{
									right:10px;
								}
								a{
									.pic_box{
										&::after{
											display: none;
										}
									}
								}
							}
							
						}
						a{
							padding:0 20px;
							position:relative;
							display: block;
							@media(max-width:650px){
								padding:0 10px;
							}
							@media(min-width:1024px){
								&:hover{
									.pic_box{
										.pic{
											.ico{
												transform:scale(1);
												@include opacity(1);
											}
											.mask{
												@include opacity(1);
											}
										}
									}
									.cont{
										.t{
											color:$color;
										}
									}
								}
							}
							.pic_box{
								width:100%;
								position:relative;
								&::after{
									content:'';
									display:block;
									position:absolute;
									width:1px;
									height:100%;
									right:-20px;
									top:0;
									z-index:20;
									background: #e1e1e1;
									@media(max-width:650px){
										right:-10px;
									}
								}
								.pic{
									overflow: hidden;
									position:relative;
									.ico{
										width:60px;
										height:60px;
										background:url(../img/jico.png) no-repeat center center;
										background-size:cover;
										position:absolute;
										left:50%;
										margin-left:-30px;
										top:50%;
										margin-top:-30px;
										z-index:20;
										transform:scale(0.5);
										@include opacity(0);
										transition:transform 0.5s,opacity 0.5s;
									}
									.mask{
										position:absolute;
										left:0;
										top:0;
										transition:opacity 0.5s;
										width:100%;
										height:100%;
										background:rgba($color,0.9);
										@include opacity(0);
										z-index:10;
									}
									img{
										position:absolute;
										left:0;
										top:0;
										right:0;
										bottom:0;
										margin:auto;
										max-width:100%;
										max-height: 100%;
									}
								}
								
							}
							.cont{
								margin-top:22px;
								padding-bottom:35px;
								text-align: center;
								padding-left:10px;
								padding-right:10px;
								@media(max-width:1024px){
									margin-top:15px;
									padding-bottom:25px;
								}
								@media(max-width:650px){
									margin-top:10px;
									padding-bottom:15px;
								}
								.t{
									@include fz(20px,34px);
									color:#333;
									@extend .ellipsis;
									transition:color 0.5s;
									@media(max-width:1024px){
										@include fz(18px,30px);
									}
									@media(max-width:650px){
										@include fz(16px,24px);
									}
								}
								.ds{
									@extend .ellipsis;

									@include fz(14px,26px);
									color:#666;
									@media(max-width:1024px){
										@include fz(13px,20px);
									}
								}
							}
						}
					}
				}
			}
			.plan_list{
				padding-top:30px;
				@media(max-width:600px){
					padding-top:0;
				}
				.page_box{
					margin-top: 70px;
					@media(max-width:900px){
						margin-top:50px;
					}
					@media(max-width:600px){
						margin-top:30px;
					}
				}
				ul{
					li{
						margin-top:30px;
						background-color: #fff;
						box-shadow: 0 5px 40px rgba(132,132,132,.15);
						@media(max-width:900px){
							margin-top:20px;
						}
						@media(max-width:850px){
							&:first-child{
								margin-top:0;
							}
						}
						a{
							display: block;
							padding:20px;
							position:relative;
							min-height:200px;
							@media(max-width:1200px){
								min-height:180px;
							}
							@media(max-width:900px){
								min-height:150px;
							}
							@media(max-width:750px){
								min-height:inherit;
								padding:15px;
							}
							@media(min-width:1024px){
								&:hover{
									.pic{
										img{
											transform:scale(1.05);
										}
									}
									.cont{
										.t{
											color:$color;
										}
									}
								}
							}
							.pic{
								width:360px;
								height:200px;
								position:absolute;
								top:20px;
								left:20px;
								overflow: hidden;
								@media(max-width:1200px){
									width:324px;
									height:180px;
								}
								@media(max-width:900px){
									width:270px;
									height: 150px;
								}
								img{
									transition:all 0.5s ease-in-out;
									width:100%;
									height: auto;
								}
								@media(max-width:750px){
									position:static;
									width:100%;
									height: auto;
								}
							}
							.cont{
								padding-top:15px;
								padding-left: 398px;
								padding-right:54px;
								@media(max-width:1200px){
									padding-left:350px;
									padding-right:0;
								}
								@media(max-width:900px){
									padding-left:300px;
									padding-top:10px;
								}
								@media(max-width:750px){
									padding-left:0;

								}
								.t{
									@include fz(24px,36px);
									color:#333;
									@extend .ellipsis;
									transition:color 0.5s ease-in-out;
									@media(max-width:1200px){
										@include fz(20px,32px);
									}
									@media(max-width:600px){
										@include fz(18px,28px);
									}
								}
								.con{
									@include fz(14px,26px);
									color:#666;
									height: 52px;
									overflow: hidden;
									margin-top:10px;
									@media(max-width:1200px){
										@include fz(14px,24px);
										height: 48px;
									}
									@media(max-width:600px){
										margin-top:6px;
									}
								}
								.more{
									width:120px;
									height:34px;
									margin-top:27px;
									background:$color;
									@include fz(14px,34px);
									color:#fff;
									text-align: center;
									@media(max-width:900px){
										margin-top:15px;
									}
									@media(max-width:600px){
										margin-top:10px;
									}
								}
							}
						}
					}
				}
			}
			.case_list{
				padding-top:17px;
				@media(max-width:850px){
					padding-top:0;
				}
				ul{
					padding-bottom:75px;
					width:110%;
					@media(max-width:1200px){
						padding-bottom:50px;
					}
					@media(max-width:750px){
						width:100%;
						padding-bottom:30px;
					}
					@media(max-width:500px){
						margin-top:0px;
						padding-bottom:20px;
					}
					li{
						float:left;
						width:29%;
						background: #fff;
						margin-right: 1.9%;
						background-color: #fff;
						cursor:pointer;
						box-shadow: 0 5px 40px rgba(142,142,142,.1);
						margin-top:2.7%;
						@media(min-width:1024px){
							&:hover{
								a,.pt{
									background: #c8a063;
									.pic{
										img{
											transform:scale(1.05);
										}
										.mask{
											@include opacity(1);
										}
										.ico{
											transform:translate(0,0);
										}
									}
									.txt{
										color:#fff;
									}
								}
							}
						}
						@media(max-width:750px){
							width:48%;
							margin-right:0;
							margin-top:4%;
							&:nth-child(even){
								float:right;
							}
						}
						@media(max-width:500px){
							width:100%;
							margin-right:0;
							float:none;
							margin-top:15px;
							&:first-child{
								margin-top:0;
							}
							&:nth-child(even){
								float:none;
							}
						}
						a,.pt{
							display: block;
							padding:5px;
							transition:all 0.5s ease-in-out;
							padding-bottom:0;
							.pic{
								width:100%;
								overflow: hidden;
								position:relative;
								.mask{
									position:absolute;
									width:100%;
									height:100%;
									background:rgba(0,0,0,0.5);
									left:0;
									top:0;
									@include opacity(0);
									transition:all 0.5s ease;
									@media(max-width:1024px){
										@include opacity(1);
										trannsition:none;
									}
								}
								.ico{
									width:76px;
									height:76px;
									overflow: hidden;
									position:absolute;
									left:50%;
									margin-left:-38px;
									top:50%;
									margin-top:-38px;
									transition: all 0.5s cubic-bezier(0, 0.76, 0.85, 0.91);
								    z-index: 10;
								    transform: translateY(-250%);
								    @media(max-width:1024px){
								    	transform: translateY(0px);
								    	transition:none;
								    }
									img{
										width:100%;
										height: auto;
										transform:scale(1) !important;
									}
									@media(max-width:1200px){
										width: 60px;
	   									height: 60px;
	   									margin-left:-30px;
	   									margin-top:-30px;
									}
									@media(max-width:600px){
										width: 40px;
	   									height: 40px;
	   									margin-left:-20px;
	   									margin-top:-20px;
									}
								}
								a{
									overflow: hidden;
									display: none;
									padding:0;
									&.show{
										display: block;
									}
								}
								img{
									width:100%;
									height: auto;
									transition:all 0.5s ease-in-out;
								}
							}
							.txt{
								@include fz(16px,24px);
								color:#666;
								padding:18px 10px;
								text-align: center;
								@extend .ellipsis;
								transition:color 0.5s ease-in-out;
								box-sizing:border-box;
								@media(max-width:1024px){
									padding:15px 10px;
								}
								@media(max-width:500px){
									font-size:14px;
									padding:10px;
								}
							}
						}
					}
				}
			}
			.swiper_solution{
				margin-top:40px;
				display: none;
				@media(max-width:1024px){
					display: block;
				}
				@media(max-width:600px){
					margin-top:25px;
				}
				.gallery-top{
					padding-bottom:20px;
					.swiper-wrapper{
						.swiper-slide{
							background: #eee;
							position:relative;
							&:nth-child(odd){
								background: #fafafa;
							}
							&.swiper-slide-active{
								&::after{
									display: block;
								}
								.con{
									.cn,.en{
										color:#fff;
									}
								}
							}
							&::after{
								content:'';
								position:absolute;
								width:100%;
								height: 123%;
								background:url(../img/jtp.png) no-repeat center center;
								background-size:100% 100%; 
								left:0;
								top:0;
								display: none;
							}
							.con{
								text-align: center;
								padding:10px;
								position:relative;
								z-index:10;
								.cn{
									@include fz(20px,30px);
									color:#333;
									@extend .ellipsis;
									@media(max-width:650px){
										@include fz(16px,24px);
									}
								}
								.en{
									@include fz(14px,24px);
									color:#ccc;
									font-family: "AVANTGARDEITCBYBT-DEMI";
									text-transform:uppercase;
									@media(max-width:1350px){
										@include fz(14px,20px);
									}
									@media(max-width:860px){
										display: none;
									}
								}
							}
						}
					}
				}
				.gallery-thumbs{
					margin-top:20px;
					.swiper-wrapper{
						.swiper-slide{
							.pic{
								display: block;
								img{
									width:100%;
									height: auto;
								}
							}
							.pro{
								ul{
									width:110%;
									li{
										float:left;
										margin-top:30px;
										width:28.74%;
										margin-right:2.4%;
										background: #fff;
										padding-bottom:15px;
										a{
											display: block;
											@media(min-width:1024px){
												&:hover{
													.tu{
														img{
															transform:scale(1.05);
														}
													}
													.txt{
														color:$color;
													}
												}
											}
											.tu{
												position:relative;
												width:100%;
												height:150px;
												img{
													position:absolute;
													left:0;
													top:0;
													transition:transform 0.5s ease-in-out;
													right:0;
													bottom:0;
													margin:auto;
													max-width:90%;
													max-height:90%;
												}
											}
											.txt{
												@include fz(14px,20px);
												color:#666;
												text-align: center;
												padding:0 5px;
												transition:color 0.5s;
												box-sizing:border-box;
												@extend .ellipsis;
											}
										}
									}
								}
							}
						}
					}
				}
			}
			.solution_list{
				margin-top:45px;
				position:relative;
				@media(max-width:1024px){
					display: none;
				}
				.right{
					position:absolute;
					right:0;
					top:0;
					height:100%;
					width:70.9%;
					ul{
						width:100%;
						height:100%;
						.li{
							position:absolute;
							left:0;
							top:0;
							width:100%;
							height:100%;
							@include opacity(0);
							transition:all 0.5s;
							&.active{
								@include opacity(1);
								z-index:10;
							}
							.pic{
								width:100%;
								height:100%;
								display: block;
							}
							.pro{
								width:86.8%;
								position:absolute;
								left:50%;
								margin-left:-43.4%;
								bottom:-30px;
								ul{
									width:110%;
									li{
										float:left;
										width:28.74%;
										margin-right:2.4%;
										background: #fff;
										padding-bottom:15px;
										box-shadow: 0 5px 40px rgba(132,132,132,.15);

										a{
											display: block;
											@media(min-width:1024px){
												&:hover{
													.tu{
														img{
															transform:scale(1.05);
														}
													}
													.txt{
														color:$color;
													}
												}
											}
											.tu{
												position:relative;
												width:100%;
												height:150px;
												img{
													position:absolute;
													left:0;
													top:0;
													transition:transform 0.5s ease-in-out;
													right:0;
													bottom:0;
													margin:auto;
													max-width:90%;
													max-height:90%;
												}
											}
											.txt{
												@include fz(14px,20px);
												color:#666;
												text-align: center;
												padding:0 5px;
												transition:color 0.5s;
												box-sizing:border-box;
												@extend .ellipsis;
											}
										}
									}
								}
							}
						}
					}
				}
				.left{
					position:relative;
					z-index:20;
					width:29.1%;
					ul{
						li{
							background: #eee;
							height: 140px;
							padding:0 10px;
							box-sizing:border-box;
							position:relative;
							@media(max-width:1350px){
								height: 120px;
							}
							@media(max-width:1100px){
								height: 110px;
							}
							&:nth-child(even){
								background: #fafafa;
							}
							&.active{
								&::after{
									transform:scaleY(1);
								}
								.num{
									background-color: #ffcd81;
									box-shadow: 0 5px 5px rgba(198,198,198,.36);
									color:#333;
								}
								.tab{
									.tab_cell .cont{
										.cn,.en{
											color:#fff;
										}
									}
								}
							}
							&::after{
								content:'';
								position:absolute;
								width:107%;
								height:100%;
								left:0;
								top:0;
								background:url(../img/bgg.png) no-repeat center center;
								background-size:100% 100%;
								transform:scaleY(0);
								transition:transform 0.38s cubic-bezier(0.4, 0, 0.2, 1);
							}
							.num{
								width:40px;
								height:40px;
								background: #fff;
								position:absolute;
								top:0;
								margin-top:-20px;
								@include fz(18px,40px);
								color:#ccc;
								transition:all 0.38s cubic-bezier(0.4, 0, 0.2, 1);
								text-align: center;
								left:19%;
								border-radius:50%;
								z-index:10;
							}
							.tab{
								width:100%;
								height:100%;
								text-align: center;
								display:table;
								.tab_cell{
									display: table-cell;
									vertical-align: middle;
									.cont{
										position:relative;
										z-index:10;
										.cn{
											@include fz(24px,30px);
											color:#333;
											transition:color 0.38s cubic-bezier(0.4, 0, 0.2, 1);
											@media(max-width:1350px){
												@include fz(20px,30px);
											}
										}
										.en{
											transition:color 0.38s cubic-bezier(0.4, 0, 0.2, 1);
											@include fz(16px,24px);
											color:#ccc;
											font-family: "AVANTGARDEITCBYBT-DEMI";
											text-transform:uppercase;
											@media(max-width:1350px){
												@include fz(14px,20px);
											}
										}
									}
									
								}
							}
						}
					}
				}
			}
			.wrap{
				padding-top:95px;
				padding-bottom:120px;
				@media(max-width:1200px){
					padding-top:80px;
					padding-bottom:100px;
				}
				@media(max-width:1024px){
					padding:60px 0;
				}
				@media(max-width:600px){
					padding:30px 0;
				}
				.wrap_cen{

				}
			}
		}
	}
}
.main.on{
	opacity:1;
}

.page_box{
	text-align: center;
	font-size:0;
	a{
		width:30px;
		height:30px;
		border-radius:30px;
		display: inline-block;
		vertical-align: top;
		@include fz(16px,30px);
		margin:0 5px;
		text-align: center;
		transition:all 0.3s;
		color:#666;
		@media(min-width:1024px){
			&:hover{
				background: #c8a063;
				color:#fff;
			}
		}
		&.active{
			background: #c8a063;
			color:#fff;
		}
		&.prev{
			margin-right:30px;
			background:url(../img/l.png) no-repeat center center;
		}
		&.next{
			margin-left:30px;
			background:url(../img/r.png) no-repeat center center;
		}
		@media(max-width:650px){
			@include fz(14px,30px);
			margin:5px;
			width:24px;
			height: 24px;
			line-height:24px;
			&.prev,&.next{
				margin:5px 0;
			}
		}
	}
}

.mask_bg{
	position:fixed;
	width:100%;
	height:100%;
	background:rgba(0,0,0,0.6);
	left:0;
	top:0;
	z-index:1000;
	@include opacity(0);
	visibility: hidden;
	transition:all 0.5s;
	&.active{
		visibility: visible;
		@include opacity(1);
	}
}

.detail_box{
	transition:opacity 0.5s,visibility 0.5s;
	width:1440px;
	position:absolute;
	background: #fff;
	border-radius:20px;
	left:50%;
	margin-left:-720px;
	top:10%;
	padding:100px;
	box-sizing:border-box;
	z-index:10001;
	visibility: hidden;
	@include opacity(0);
	&.active{
		visibility: visible;
		@include opacity(1);
	}
	@media(max-width:1460px){
		width:90%;
		margin-left:-45%;
	}
	@media(max-width:1200px){
		&.detail_box2{
			padding:60px;
			.prev{
				width:40px;
				height:40px;
				left:15px;
				margin-top:-20px;
			}
			.next{
				width:40px;
				height:40px;
				right:15px;
				margin-top: -20px;
			}
			.close{
				width:40px;
				height:40px;
			}
		}
	}
	@media(max-width:1024px){
		padding:60px;
	}
	@media(max-width:750px){
		position:fixed;
		right:0;
		top:0 !important;
		left:0;
		bottom:0;
		margin:0;
		width:100%;
		height:100%;
		border-radius:0;
		overflow-y: auto;
		overflow-x:overflow;
		padding:60px 20px 40px 20px !important;		
		&.detail_box2{
			.prev{
				width:30px;
				height:30px;
				left:-3px;
				margin-top:-15px;
				background-size:30% auto;
			}
			.next{
				width:30px;
				height:30px;
				right:3px;
				background-size:30% auto;
				margin-top: -15px;
			}
			.close{
				width:30px;
				height:30px;
				background-size:50% auto;
			}
		}	
	}
	.prev{
		border-radius: 25px;
		width:50px;
		height:50px;
		box-shadow: 0 5px 20px rgba(156,156,156,.24);
		border-radius:50%;
		background:url(../img/pl.png) no-repeat center center #fff;
		position:absolute;
		left:22px;
		top:30%;
		cursor:pointer;
		margin-top:-25px;
		z-index:20;
		transition:background 0.5s;
		&.prev2{
			top:50%;
		}
		@media(min-width:1024px){
			&:hover{
				background:url(../img/pl2.png) no-repeat center center #c8a063;
			}
		}
		@media(max-width:1024px){
			width:40px;
			height:40px;
			left:15px;
			&.prev2{
				margin-top:-20px;
			}
		}
		@media(max-width:750px){
			width:30px;
			height:30px;
			left:3px;
			background-size:30% auto;
			&.prev2{
				margin-top:-15px;
			}
		}

	}
	.next{
		border-radius: 25px;
		width:50px;
		height:50px;
		box-shadow: 0 5px 20px rgba(156,156,156,.24);
		border-radius:50%;
		background:url(../img/pr.png) no-repeat center center #fff;
		position:absolute;
		right:22px;
		top:30%;
		cursor:pointer;
		margin-top:-25px;
		z-index:20;
		transition:background 0.5s;
		&.next2{
			top:50%;
		}
		@media(min-width:1024px){
			&:hover{
				background:url(../img/pr2.png) no-repeat center center #c8a063;
			}
		}
		@media(max-width:1024px){
			width:40px;
			height:40px;
			right:15px;
			&.next2{
				margin-top:-20px;
			}
		}
		@media(max-width:750px){
			width:30px;
			height:30px;
			right:3px;
			background-size:30% auto;
			&.next2{
				margin-top:-15px;
			}
		}
	}
	.close{
		width:50px;
		height:50px;
		border-radius:50%;
		background:url(../img/close.png) no-repeat center center #e1e1e1;
		position:absolute;
		right:15px;
		top:16px;
		cursor:pointer;
		transition:all 0.5s;
		z-index:10;
		@media(min-width:1024px){
			&:hover{
				background:url(../img/close2.png) no-repeat center center #c8a063;
			}
		}
		@media(max-width:1024px){
			width:40px;
			height:40px;
		}
		@media(max-width:750px){
			width:30px;
			height:30px;
			background-size:50% auto;
		}
	}
	.db{
		.pic{
			float:left;
			width:65%;
			overflow: hidden;
			img{
				width:100%;
				height: auto;
			}
			@media(max-width:1024px){
				width:100%;
				float:none;
			}
		}
		.cont_box{
			width:31.54%;
			float: right;
			padding-top:30px;
			@media(max-width:1300px){
				padding-top:0;
			}
			@media(max-width:1024px){
				width:100%;
				float:none;
				margin-top:20px;
			}
			.t{
				@include fz(28px,36px);
				color:#333;
				@media(max-width:1350px){
					@include fz(24px,30px);
				}
				@media(max-width:800px){
					@include fz(20px,28px);
				}
			}
			.model{
				display: inline-block;
				@include fz(16px,36px);
				padding:0 25px;
				background:$color;
				border-radius:18px;
				margin-top:18px;
				color:#fff;
				@media(max-width:800px){
					@include fz(14px,30px);
					margin-top:10px;
					padding:0 15px;
				}
			}
			.con{
				margin-top:25px;
				@include fz(14px,28px);
				color:#666;
				@media(max-width:1200px){
					line-height:24px;
					margin-top:20px;
				}
				@media(max-width:750px){
					margin-top:15px;
				}
			}
			.intro_box{
				margin-top: 38px;
				@media(max-width:1300px){
					margin-top:25px;
				}
				@media(max-width:800px){
					margin-top:18px;
				}
				.ti{
					@include fz(18px,24px);
					color:$color;
					font-weight:bold;
					border-bottom:1px solid #e1e1e1;
					padding-bottom:8px;
					@media(max-width:800px){
						@include fz(16px,20px);
					}
				}
				.txt{
					@include fz(14px,24px);
					color:#666;
					margin-top:12px;
					@media(max-width:800px){
						margin-top:8px;
					}
				}
			}
		}
	}
	.content_box{
		position:relative;
		
		.dl{
			position:absolute;
			width:48.4%;
			left:0;
			top:0;
			height:100%;
			border:1px solid #e1e1e1;
			box-sizing:border-box;
			@media(max-width:750px){
				width:100%;
				position:static;
				height:4rem;
			}
			.swiper-container{
				height:100% !important;
				.swiper-wrapper{
					height:100% !important;
					.swiper-slide{
						height:100% !important;
						text-align: center;
						position:relative;
						img{
							position:absolute;
							left:0;
							top:0;
							max-width:90%;
							bottom:0;
							margin:auto;
							right:0;
							max-height:90%;
						}
					}
				}
				.pagination{
					position:absolute;
					width:100%;
					left:0;
					bottom:35px;
					line-height:0;
					font-size:0;
					text-align: center;
					@media(max-width:750px){
						bottom:10px;
					}
					span{
						width:10px;
						height:10px;
						background: #cccccc;
						border-radius:50%;
						display: inline-block;
						margin:0 5px;
						cursor:pointer;
						&.swiper-active-switch{
							background: #c8a063;
						}
					}
				}
			}
		}
		.dr{
			width:51.6%;
			float:right;
			padding:55px 5.6%;
			background: #fafafa;
			box-sizing:border-box;
			@media(max-width:750px){
				width:100%;
				float:none;
				padding:30px 20px;
			}
			.t{
				@include fz(36px,50px);
				color:#333;
				@media(max-width:1300px){
					@include fz(30px,50px);
				}
				@media(max-width:1024px){
					@include fz(26px,40px);
				}
				@media(max-width:750px){
					@include fz(22px,30px);
				}
			}
			.con{
				margin-top:25px;
				@include fz(14px,28px);
				color:#666;
				img{
					max-width:100%;
					height: auto !important;
				}
				@media(max-width:1200px){
					line-height:24px;
					margin-top:20px;
				}
				@media(max-width:750px){
					margin-top:15px;
				}
			}
		}
	}
	.ds_box{
		padding-top:75px;
		@media(max-width:1024px){
			padding-top:50px;
		}
		@media(max-width:750px){
			padding-top:30px;
		}
		@media(max-width:500px){
			padding-top:15px;
		}
		.tit{
			border-bottom:1px solid #e1e1e1;
			@include fz(28px,32px);
			padding-bottom:16px;
			color:#333;
			@media(max-width:1024px){
				@include fz(24px,32px);
			}
			@media(max-width:750px){
				@include fz(18px,24px);
			}
			.t{
				display: inline-block;
				vertical-align: bottom;
				position:relative;
				&::after{
					content:'';
					position:absolute;
					width:100%;
					background: #c8a063;
					height:3px;
					left:0;
					bottom:-18px;
				}	
			}
			.en{
				display: inline-block;
				vertical-align: bottom;
				@include fz(16px,16px);
				color:#999;
				font-family: "Roboto";
				margin-left:12px;
				@media(max-width:750px){
					@include fz(13px,13px);
					margin-left:5px;
				}
			}
		}
		.list_box{
			padding-top:10px;
			ul{
				li{
					position:relative;
					min-height:68px;
					padding-left:85px;
					margin-top:32px;
					@media(max-width:1024px){
						margin-top:20px;
					}
					@media(max-width:500px){
						margin-top:12px;
						padding-left:70px;
					}
					.pic{
						position:absolute;
						left:0;
						top:0;
						width:68px;
						height:68px;
						overflow: hidden;
						img{
							width:100%;
							height:auto;
						}
						@media(max-width:500px){
							width:50px;
							height: 50px;
						}
					}
					.cont{
						.t{
							@include fz(20px,22px);
							color:#c8a063;
							@media(max-width:1024px){
								@include fz(18px,20px);
							}
						}
						.con{
							@include fz(14px,24px);
							color:#666;
							margin-top:6px;
						}
					}
				}
			}
		}
	}
}

.video_bg{
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	z-index:10000;
	background:rgba(0,0,0,0.6);
	transform:translateY(0%);
	@include opacity(0);
	visibility:hidden;
	transition:all 0.5s;
	&.active{
		@include opacity(1);
		transform:translateY(0%);
		visibility:visible;
		
	}
}
.js-cont{
	width:642px;
	height:480px;
	position:fixed;
	top:50%;
	margin-top:-240px;
	left:50%;z-index:10001;
	margin-left:-321px;  
	box-sizing:border-box;
	transform:translateY(100px);
	visibility:hidden;
	transition:all 0.5s;
	@include opacity(0);
	&.active{
		transform:translateY(0%);
		@include opacity(1);
		
		visibility:visible;
	}
	video{
		width:100%;
		height:100%;
		display: block;
	}
	.close{
		width:40px;
		height:40px;
		position:absolute;
		right:-40px;
		cursor:pointer;
		top:0;
		background:url(../img/close.png) no-repeat center center;
		@media(max-width:500px){
			background-size:16px 16px !important; 
		}
	}
	@media (max-width: 900px){
	    width: 538px;
	    height: 404px;
	    background: none;
	    margin-left: -269px;
	    margin-top:-202px; 
	}
	@media (max-width: 660px){
	    width: 300px;
	    height: 228px;
	    margin-left:-150px;
	    margin-top:-114px;  
	    .close{
	    	top:-40px;
	    	right:0;
	    }
	}
}
